在jQuery框架中,delay方法用于延迟执行下一个队列中的函数。它可以添加一个延迟时间(以毫秒为单位)来暂停元素上正在运行的动画或效果,然后再继续执行下一个函数。
基本语法如下:
$(selector).delay(duration)
参数解释:
- selector:要添加延迟的元素选择器。
- duration:延迟的时间,以毫秒为单位。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
div{
width: 800px;
height: 40px;
background-color: #eee;
border-radius: 5px;
border: 1px solid #aaa;
text-align: center;
line-height: 40px;
margin: 20px auto 0;
display: none;
}
</style>
</head>
<body>
<div>这是一个提示信息</div>
<script type="text/javascript" src="../jquery-3.2.1.js"></script>
<script type="text/javascript">
$(function () {
$("div").text("添加成功").css({"background-color":"yellowgreen","color":"green"}).fadeIn(1000).delay(2000).fadeOut(1000)
})
</script>
</body>
</html>
上述运行结果: