Mouseout事件在鼠标实际退出之前触发
Mouseout event fires before mouse is actually out
我有一个mouseover/mouseout处理程序。两者都使用Javascript超时来延迟它们的工作。但是当鼠标仍在选择器上时,mouseout事件也会触发。当在mouseout脚本中关闭超时时,它正常工作。我想我在timeout上做错了什么。就像
$('.selector').live( {mouseover : function() {
var timeout = setTimeout(function() {
$('.something' ).show();
}, 1000);
}, mouseout: function () {
timeout = setTimeout(function() {
$('.something' ).hide();
}, 2000);
}
});
如果我使用悬停处理程序而不是mouseover/mouseout,也会发生同样的事情。如果我对两个超时使用不同的变量名,或者在调用另一个超时之前清除一个超时,也是一样的。我做错了什么?
由于它正常工作,没有超时,我认为mouseover/mouseout是正确的事件,而不是mouseenter/mouseleave。
当你不断调用多个超时时,你需要使用一个计时器,一次只计时一件事:
(function () {
var timeout = 0;
$('.selector').live({
mouseover: function () {
window.clearTimeout( timeout );
timeout = setTimeout(function () {
$('.something').show();
}, 1000);
},
mouseout: function () {
window.clearTimeout( timeout );
timeout = setTimeout(function () {
$('.something').hide();
}, 2000);
}
});
})()
window.setTimeout
只是返回一个普通的整数。每次调用window.setTimeout
时,无论将返回值赋给哪个变量,都会创建一个新的计时器。window.setTimeout
返回值可用于清除指定定时器
作为一个副作用,您可以清除您甚至不知道存在的超时。例如:
jQuery("div").fadeOut( 15000 );
var l = 10000;
while( l-- ) window.clearTimeout( l );
你是蛮力强迫10000个不同的计时器id和清除他们所有,拿出jQuery fx内部计时器停止淡出。请勿在实际代码中使用,仅用于演示目的。
你应该清除超时,这样它们就不会重叠。
var timeout = null;
$('#foo').live({
mouseover: function() {
if(timeout !== null){
clearTimeout(timeout);
timeout = null;
}
timeout = setTimeout(function() {
$('#bar').show();
}, 1000);
},
mouseout: function() {
if(timeout !== null){
clearTimeout(timeout);
timeout = null;
}
timeout = setTimeout(function() {
$('#bar').hide();
}, 2000);
}
});
演示:http://jsfiddle.net/46mFc/1/
相关文章:
- Backbone fetch中的Ajax在fetch调用退出后完成,因此fetch调用中没有成功/失败事件
- 当“不相关”的 html 选择元素没有选择任何选项时,如何退出 jQuery 事件
- Parse.View:事件不是'当我退出视图并再次进入时,它不起作用
- 如何在鼠标退出事件完成之前强制鼠标悬停事件触发
- 鼠标退出事件不会在 IE 8 中触发
- 鼠标退出和鼠标悬停事件在 Chrome 39 中未正确触发
- jQuery悬停或JavaScript鼠标退出事件,用于菜单“登录”
- 如何仅拦截顶级标记的鼠标退出事件
- 鼠标退出事件未在拉斐尔.js中触发
- 如果在鼠标悬停事件中触发了鼠标关闭,则立即返回,并且不执行链接的鼠标退出事件
- 当我单击 asp.net 中的退出按钮时,文本框模糊事件未触发
- 执行异步代码时;退出“;事件
- 从浏览器卸载事件中获取退出值
- 当父函数被激发时,不退出第一次按键事件
- 鼠标从下拉列表中退出事件
- 当卸载或退出事件时,执行函数jQuery
- 什么's节点js中进程退出事件的目的
- 如何在Firebase匿名登录中注册退出事件的回调
- 使用javascript退出事件
- 检查鼠标是否在鼠标退出事件 - jQuery 上按下