javascript 在一段时间内禁用单击事件处理程序
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8335177/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
disable click event handler for a duration of time
提问by user701510
I've already looked at similar questions but the answers provided involve buttons and not div elements. When I click the div element with id click, the click event handler is disabled by unbind()and sets a timer for 2 seconds. After 2 seconds, the click event handler should be enabled again by bind(). The problem is that the click event handler doesn't seem to get "rebound". I am appending text to another div element to check if the click event handler is active.
我已经看过类似的问题，但提供的答案涉及按钮而不是 div 元素。当我单击带有 id 的 div 元素时click，单击事件处理程序被禁用unbind()并设置一个 2 秒的计时器。2 秒后，单击事件处理程序应由 再次启用bind()。问题是点击事件处理程序似乎没有“反弹”。我将文本附加到另一个 div 元素以检查单击事件处理程序是否处于活动状态。
Here is my jsfiddle:
这是我的 jsfiddle：
回答by nnnnnn
Another approach to the whole problem is not to bother with unbinding and rebinding and just use a "disabled" flag:
解决整个问题的另一种方法是不要打扰解除绑定和重新绑定，只需使用“禁用”标志：
$(document).ready(function(){
var clickDisabled = false;
$('#click').click(function(){
if (clickDisabled)
return;
// do your real click processing here
clickDisabled = true;
setTimeout(function(){clickDisabled = false;}, 2000);
});
});
回答by Ariel
When you are rebinding the function the second time you are binding just a subset of all your code - all it does it output bound to the status, but it doesn't contain any of the code for doing a timeout a second time.
当您第二次重新绑定函数时，您只绑定了所有代码的一个子集——它所做的一切都输出绑定到状态，但它不包含任何第二次超时的代码。
Also, you will like the .one()function.
此外，您会喜欢该.one()功能。
I've fixed up your code here: http://jsfiddle.net/eQUne/6/
我在这里修正了你的代码：http: //jsfiddle.net/eQUne/6/
function bindClick() {
$('#click').one('click', function() {
$('#status').append("bound ");
setTimeout(bindClick, 2000);
});
}
$(document).ready(function(){
bindClick();
});
回答by Ryan Doherty
Try this:
试试这个：
$(document).ready(function(){
$('#click').click(function(){
$('#click').unbind('click');
$('#status').append("unbound ");
setTimeout(
function(){
$('#click').bind('click',function(){
});
$('#status').append("bound ");
},
2000
);
});
});
You misspelled setTimeout and your "bound" message was being appended only on click.
您拼错了 setTimeout 并且您的“绑定”消息仅在单击时附加。
回答by JesseBuesking
If I got what you were asking correctly, this should work:
如果我得到了你的正确要求，这应该有效：
<div id="click" >time out</div>
<div id="status"></div>
$(document).ready(function() {
$('#click').click(unbindme);
$('#status').html('bound');
function unbindme()
{
$('#click').unbind('click');
$('#status').html('unbound');
setTimeout(function(){
alert('here');
$('#status').html('bound');
$('#click').click(unbindme);
}, 2000);
}
}
Check it out here: http://jsfiddle.net/eQUne/
在这里查看：http: //jsfiddle.net/eQUne/
回答by Alireza Noori
I answer your question but just don't kill yourself :)) Just kidding... Your code is fine just a typo: setTimeOutshould be setTimeout(the O should be o)
我回答你的问题，但不要自杀:)) 开玩笑……你的代码很好，只是一个错字：setTimeOut应该是setTimeout（O 应该是 o）
