需要用jQuery 实现 在一个元素上鼠标移入延迟200毫秒触发事件,但是200不到则取消触发。用JS也可以
好久不写JS了,已经有些淡忘了。需要做的效果如题,目前我知道需要用到mouseover和mouseout两个事件。现在使用的是jQuery的doTimeout插件实现了鼠...
好久不写JS了,已经有些淡忘了。需要做的效果如题,目前我知道需要用到mouseover和mouseout两个事件。现在使用的是jQuery 的doTimeout插件实现了鼠标移入延迟加载。code 片段:$.doTimeout(200,function(){ alert(1);});
问题是在mouseover不到200秒,怎么取消事件。模糊的记忆中有个clearTimeout的东东还是什么。请大家赐教了。 展开
问题是在mouseover不到200秒,怎么取消事件。模糊的记忆中有个clearTimeout的东东还是什么。请大家赐教了。 展开
6个回答
展开全部
在jquery中用hover(function(){},function(){})比较好,因为处理鼠标进入离开事件的话,用mouseover 和 mouseout会有bug,用hover的话,参数,前一个是进入的时候触发的函数,后一个是离开的时候触发的函数。
你的这个需求就是进入的时候设置一个settimeout,如果没到200毫秒就退出了,则在第二个参数的函数里面设置一个clearTimeout就可以了。
你的这个需求就是进入的时候设置一个settimeout,如果没到200毫秒就退出了,则在第二个参数的函数里面设置一个clearTimeout就可以了。
追问
我也很想用hover,只是目前UI框架使用的是easyui,我要加的元素是easui动态渲染出来的,如果用hover绑定元素,但是这个时候元素并没有生成。
追答
hover都用不了,那你用其他的不一样需要绑定元素么?不管是不是动态渲染出来的,只要你能获取到这个对象,然后给他bind这个方法就可以了。
至于说hover容易混乱,大家要知道,不管你用什么方法,都是针对某一个对象或者一组对象来实施的。从原理上来说,hover和mouseover mouseout或者是mouseenter mouseleave是一样的,我估计大家可能都不知道我所说的mouseover那个bug是什么,那个bug就是当你鼠标进入你设定的对象时,随着你的鼠标的轻微移动,会不停的触发over和out效果,但是hover就不会,只会触发一次。
总结的说,hover = mouseenter + mouseleave。你能用mouseenter就能用hover。
展开全部
$(function(){
$(target).mouseover(function(){
b=setTimeout(function(){代码...},200) ;
}).mouseout(function(){
clearTimeout(b)
}).
})
$(target).mouseover(function(){
b=setTimeout(function(){代码...},200) ;
}).mouseout(function(){
clearTimeout(b)
}).
})
追问
这个有BUG:
$("#qqq").mouseover(function(){
b=setTimeout(function(){alert(1);},200) ;
}).mouseout(function(){
clearTimeout(b);
alert(2);
});
如果鼠标移入满200毫秒,会先执行mouseout里面的alert(2);再执行mouseover里面的alert(1)
追答
aler的出现顺序先说一下,出现在最前面的,包含这个aler的程序一定是最后执行的。这个例子比较特殊,因为浏览器一旦出现alert一类对话框就会将浏览器焦点改变,这个会触发元素的mouseout事件。所以换个方法测试
$(function(){
$("#qqq").mouseenter(function(){
$this=$(this);
b=setTimeout(function(){$this.css("background","red");},200) ;
}).mouseleave(function(){
clearTimeout(b);
$this.css("background","black")
});
})
这么个简单的程序从逻辑上想一下都能够想通,怎么可能出现你说的那种问题呢?我差点都被你忽悠了,还有wish4sun 所说的问题,hover以我目前的能力来说对多个元素根本不适用会造成逻辑混乱。不过也有相应的方法替代,就是mouseenter和mouseleave效果和hover一样。
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
mouseover/mouseout 与clearTimeout setTimeout结合使用时,确实有一个BUG,看下面这篇文章,里面关于这个bug描述的很详细,有完整的在线实例演示,还有解决的方法:
clearTimeout与mouseover/mouseout 或mouseenter/mouseleave结合使用时无效或闪烁的解决方法
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
setInterval() 和 clearInterval() .
// js
var int;
function test(){
int setInterval("clock()",500) //循环调用函数
}
function test2(){
window.clearInterval(int) //取消调用
}
// js
var int;
function test(){
int setInterval("clock()",500) //循环调用函数
}
function test2(){
window.clearInterval(int) //取消调用
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
wish4sun 的说法如果是真的那这个算是一种解决办法了
我也在找这个答案 等下去测试
我也在找这个答案 等下去测试
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询