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

比如有一个按钮,当鼠标移动到这个按钮上3秒钟后弹出一个窗口;如果不到3秒就又移走了鼠标则取消即将弹出窗口的动作。如何实现?... 比如有一个按钮,当鼠标移动到这个按钮上3秒钟后弹出一个窗口;如果不到3秒就又移走了鼠标则取消即将弹出窗口的动作。如何实现? 展开
 我来答
百度网友2571d37bb
推荐于2016-09-27 · 知道合伙人软件行家
百度网友2571d37bb
知道合伙人软件行家
采纳数:1971 获赞数:7905
前端工程师

向TA提问 私信TA
展开全部

延迟出口弹出,最简单方法就是用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一秒后显示。
JarnonWang
2011-09-29 · TA获得超过149个赞
知道小有建树答主
回答量:316
采纳率:0%
帮助的人:88.9万
展开全部
我写好了一个,主要是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();
})
})
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
塞翁失马焉非福
推荐于2018-03-05 · TA获得超过155个赞
知道小有建树答主
回答量:319
采纳率:0%
帮助的人:254万
展开全部
在鼠标放在按钮的事件中定制一个定时器,3秒后触发事件(实现弹出窗口功能),在鼠标离开按钮事件中删除此定时器。如果3秒后触发了该事件就OK了,如果不到3秒,鼠标将触发离开事件,那么触发器会销毁,不在执行弹出窗口事件。

不会写追问,我帮你写。
追问
我就是这样写的,不行啊。当mouseover或mouseout时,会反复触发这些事件。。。你帮我写写吧
追答
你好,既然你都实现mouseover和mouseout了,现在你的问题就是你使用的导致鼠标滑过多个时会反复提示,你可以把(不是单个li,而是整个ul或ol)放在一个div上,控制好div的高度与宽度和一致,将over和out事件放在div就可以。
不知道是否是你的要求,这个out、over代码用你现在写的就行。
本回答被提问者和网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
tjx0900968
2011-09-30
知道答主
回答量:33
采纳率:0%
帮助的人:8.2万
展开全部
简单的说。这是js事件冒泡了。。
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
收起 更多回答(2)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式