ajax提示框
时间: 2023-06-29 08:16:45 浏览: 58
您可以使用jQuery中的ajax()方法来实现一个提示框。具体实现步骤如下:
1. 引入jQuery库文件。
2. 创建一个HTML元素来显示提示框。
3. 在JavaScript代码中使用ajax()方法发送请求并在请求成功后显示提示框。
以下是一个示例代码:
```
<!DOCTYPE html>
<html>
<head>
<title>Ajax提示框</title>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<style>
#msg{ display:none; position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); background:#fff; padding:20px; border:1px solid #999; }
</style>
</head>
<body>
<button onclick="showMsg()">显示提示框</button>
<div id="msg">请求成功!</div>
<script>
function showMsg(){
$.ajax({
type:"post",
url:"example.php",
success:function(){
$("#msg").fadeIn(500).delay(2000).fadeOut(500);
}
});
}
</script>
</body>
</html>
```
在上述示例代码中,我们创建了一个id为"msg"的HTML元素来显示提示框,使用jQuery的fadeIn()、delay()和fadeOut()方法来实现提示框的显示和隐藏。在JavaScript代码中,我们使用ajax()方法发送请求,请求成功后显示提示框。您需要将url属性设置为您要发送请求的URL,并将success回调函数中的代码替换为您想要执行的代码。