javascript - 使用 jQuery 防止连续点击绑定(bind)在 div 上

Question

我正在玩 slider 脚本。在脚本中，左右箭头包裹在一个 div 中，单击事件绑定(bind)在 div 上。它没有问题，但是当它点击 div 时我需要什么，我需要防止连续点击两秒钟。然后它应该可以再次点击。如果有任何建议，我将不胜感激。

$container.find('.laos-slider-controls').bind('click',function(){
  var target = $(this).attr('data-target');
  if(target!='next'&&target!='prev') target=parseInt(target);
  changeSlides(target);
});

HTML 是:

<div class="laos-slider-controls-wrapper">
  <div class="laos-slider-controls" data-target="prev">&lsaquo;</div>
  <div class="laos-slider-controls" data-target="next">&rsaquo;</div>
  <ul class="laos-slider-pagers"></ul>
</div>

Answer 1

一种可能的解决方案是使用标志变量 isClickable 和超时在特定时间后重置此标志变量。

(function () {
    var isClickable = true;

    $container.find('.laos-slider-controls').bind('click',function(){
        if (isClickable) {
            var target = $(this).attr('data-target');
            if(target!='next'&&target!='prev') target=parseInt(target);
            changeSlides(target);

            isClickable = false;

            setTimeout(function () {
                isClickable = true;
            }, 2000);
        }
    });
})();