有没有办法将所有双击事件绑定到jQuery / JavaScript中的单击等效项?

时间:2016-02-12 10:05:06

标签: javascript jquery events

我有一些jQuery,有很多不同的点击事件。我的一些用户是习惯性的双重答题器,因为我没有绑定双击事件,因此触发单击事件两次;这可能是一种痛苦 - 例如,如果一次点击打开一些东西,另一次关闭它,双击就是零和游戏。

有没有办法将所有双击事件绑定到他们的单击等效事件而不需要单独编写代码?

3 个答案:

答案 0 :(得分:1)

我认为将dblclick映射到click会不会有帮助;如果有的话,我认为会让事情变得更糟。

您已经说过使用委托来连接您的活动。你可以给自己一个去除对事件处理程序的调用的函数:

// Very simple debounce, accepts first event and disregards
// subsequent ones for a period of time
function debouncedHandler(handler, delay) {
  delay = delay || 300; // milliseconds, I'm told Windows uses 500 but that seems awfully long
  var last;
  return function() {
    var now = Date.now();
    if (last && last + delay > now) {
      return false;
    }
    last = now;
    return handler.apply(this, arguments);
  };
}

$(document).on("click", "input[type=button]", debouncedHandler(function() {
  $(".container").toggleClass("toggle-open toggle-closed");
}));
.toggle-open .closed {
  display: none;
}
.toggle-closed .open {
  display: none;
}
<input type="button" value="Open/Close">
<div class="container toggle-open">
  <span class="open">OPEN</span>
  <span class="closed">closed</span>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

答案 1 :(得分:0)

<强> HTML

<button class="btn">
click me
</button>

<强> JQUERY

$(document).ready(function(){

   var clickDisabled = false;
   $('.btn').click(function(){
      if (clickDisabled)
         return;

      // do your real click processing here
            console.log('hi');
      clickDisabled = true;
      setTimeout(function(){clickDisabled = false;}, 5000);
  });

});

请检查https://jsfiddle.net/05tvvaeq/

阻止5secs的点击处理程序(您可以根据需要设置时间) 检查控制台以查看结果

答案 2 :(得分:-1)

这就是我要做的事情:

<input type="hidden" id='counter' value='0'>
<input type="button" value="Save" onclick="save()">

function save(){
var counter = parseInt(document.getElementById("counter").value);
counter = counter+1;

if(counter == 1){
console.log('Saving...')
}

document.getElementById("counter").value = counter;

//after 3 seconds set counter back to 0
     setTimeout(function(){
    document.getElementById("counter").value = 0;

    }, 3000)
}