怎么用js实现延时弹出窗口

发布网友发布时间：2022-04-23 04:06

共4个回答

热心网友时间：2022-04-22 15:37

延迟出口弹出，最简单方法就是用js里的setTimeout方法，下面是一个简单的例子：

<body>
<input type="button" id="btn" value="click me" />
<div id="div" style="width:100px; height:100px; background:#ccc; display:none;"
</body>
<script>
var oDiv = document.getElementById('div');
var oBtn = document.getElementById('btn');
oBtn.onclick=function(){
setTimeout(function(){
oDiv.style.display = 'block';
},1000);
};
</script>
点击btn后然div一秒后显示。

热心网友时间：2022-04-22 16:55

我写好了一个，主要是clearTimeout的用法，祝你好运！
<input id="fdsa" type="button" onmouseover="showalert()" onmouseout="chearshow()" />
<script type="text/javascript">
function showalert()
{
t = setTimeout("alert('hello~ boy')", 3000 )
}
function chearshow()
{
clearTimeout(t);
}
</script>追问还不行。可能是因为我的是在上用的，每个是紧挨在一起的，会反复执行吧。现在照你的写的话滑动一次就弹了三到四次窗口出来。该怎么改？
$(document).ready(function(){
$(".ul1 li").mouseover(function(){
showalert();
})
$(".ul1 li").mouseout(function(){
chearshow();
})
})

热心网友时间：2022-04-22 18:29

在鼠标放在按钮的事件中定制一个定时器，3秒后触发事件（实现弹出窗口功能），在鼠标离开按钮事件中删除此定时器。如果3秒后触发了该事件就OK了，如果不到3秒，鼠标将触发离开事件，那么触发器会销毁，不在执行弹出窗口事件。

不会写追问，我帮你写。追问我就是这样写的，不行啊。当mouseover或mouseout时，会反复触发这些事件。。。你帮我写写吧

追答你好，既然你都实现mouseover和mouseout了，现在你的问题就是你使用的导致鼠标滑过多个时会反复提示，你可以把（不是单个li,而是整个ul或ol）放在一个div上，控制好div的高度与宽度和一致，将over和out事件放在div就可以。
不知道是否是你的要求，这个out、over代码用你现在写的就行。

热心网友时间：2022-04-22 20:21

简单的说。这是js事件冒泡了。。