禁用点击事件处理程序一段时间

Question

我已经查看了类似的问题，但所提供的答案涉及按钮而不是div元素。当我点击ID为click的div元素时，点击事件处理程序会被unbind()禁用，并设置一个2秒的计时器。 2秒后，点击事件处理程序应该通过bind()重新启用。问题在于，点击事件处理程序似乎没有被“重新绑定”。 我正在将文本附加到另一个div元素以检查点击事件处理程序是否处于活动状态。

这是我的JSFiddle。

- user701510

Answer 1

处理这个问题的另一种方法是不必费心解除绑定和重新绑定，而只需使用“禁用”标志：

$(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);
  });

});

- nnnnnn

Answer 2

我回答了你的问题，但不要自杀 :))只是开玩笑...你的代码很好，只有一个错别字：setTimeOut 应该是 setTimeout（O 应该是 o）

- Alireza Noori

Answer 3

当您第二次重新绑定函数时，您只绑定了所有代码的子集 - 它只是输出绑定到状态，但它不包含第二次执行超时的任何代码。

此外，您会喜欢.one()函数。

我已经在这里修复了您的代码：https://jsfiddle.net/eQUne/6/

function bindClick() {
    $('#click').one('click', function() {
        $('#status').append("bound ");
        setTimeout(bindClick, 2000);
    });
}

$(document).ready(function(){
    bindClick();
});

- Ariel

Answer 4

试试这个：

$(document).ready(function(){

$('#click').click(function(){

    $('#click').unbind('click');
    $('#status').append("unbound ");

    setTimeout(
        function(){
            $('#click').bind('click',function(){

            });
            $('#status').append("bound ");           
        },
        2000
        );
    });
});

你拼错了 setTimeout，并且你的“bound”消息只在点击时被追加。

- Ryan Doherty

Answer 5

如果我理解你的问题正确，这应该可以工作：

<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);
    }
}

请点击这里查看: https://jsfiddle.net/eQUne/

- JesseBuesking