点击jquery之间的超时

时间:2013-12-24 15:01:20

标签: javascript jquery

我有以下代码来计算div上的点击次数

$('.ps-next').click(function () {
    setTimeout($('#currentImage').html(parseInt($('#currentImage').html(), 10) - 1), 10000);
});

$('.ps-prev').click(function () {
    setTimeout($('#currentImage').html(parseInt($('#currentImage').html(), 10) + 1), 10000);
});

我想计算点击次数,但我希望点击之间延迟1秒。或者至少不计算快速点击,任何人都可以帮助我。

2 个答案:

答案 0 :(得分:1)

你可以使用这个jquery插件

(function ($) { 
    $.fn.oneClickPerTime = function (callback,timeDelay) {
        var __this = this;
        flagOneClick = 1;
        return this.each(function () {
            $(__this).click(function() {
                if (flagOneClick==0)
                    return;
                flagOneClick = 0;
                setTimeout(function() {
                    flagOneClick = 1;
                },timeDelay);
                callback(this);
            });
        });
    } 
})(jQuery);

然后调用函数并且必须定义超时,例如:1000(1秒)

$('.ps-prev').oneClickPerTime(function(){
     //callback
},1000);

答案 1 :(得分:1)

我使用的方法与大多数方法略有不同。

事件对象具有timeStamp属性,因此我将其与之前的时间戳进行比较。这是我如何处理这种情况......

var lastClick, 
    $count = $('.count');

$('.stepper').on('click', function(e){

  // If we have a lastClick value or the current timeStamp
  // minus lastClick is greater than 1000 ( 1 second ), go to work.
  if ( !lastClick || lastClick && e.timeStamp - lastClick > 1000 ) {

    var $stepper = $(this);

    $count.text(function(i, txt){
      var current = +txt;
      return current + ( $stepper.is('.up') ? 1 : -1 );
    });

    lastClick = e.timeStamp;
  }

});

与此HTML一起使用。

<div class="stepper up">Up</div>
<div class="count">5</div>
<div class="stepper down">Down</div>

以下是快速演示:http://jsbin.com/iruXisOn/1/edit