每秒只有一次點擊的消防功能（jQuery）

Question

我在頁面上有一個按鈕，我想每秒鐘最多一次被觸發。這意味着如果用戶在5秒內像瘋子一樣點擊它，它將只執行五次。我一直在谷歌搜索和搜索堆棧，沒有結果。還嘗試了Alman的油門/反彈插件，但似乎不適用於點擊。

Answer 1

使用定時器

var clicked = false; 
setInterval(function(){ 
    clicked = false; 
},5000); 

if($('.button').click(function(){ 
    if(!clicked){ 
     do job; 
     clicked = true; 
    } 
}); 

Answer 2

爲什麼不在按鈕的單擊事件中禁用按鈕1秒？

$('#my_button').click(function() { 
    /* 
    your logic here 
    */ 

    // disable the button for 1 second 
    $(this).attr('disabled', 'disabled').delay(1000).removeAttr('disabled'); 
} 

Answer 3

創建一個油門，結束事件，除非自上一次單擊以來已經過了1秒。

var clicked = false; 
$(element).click(function(e){ 
    e.preventDefault(); 
    if (clicked) { 
     return; 
    } 
    clicked = true; 
    console.log("Do Stuff"); 
    setTimeout(function(){ 
     clicked = false; 
    },1000); 
}); 

或者你可以使用一個數據屬性來避免額外的變量：

$(element).click(function(e){ 
    e.preventDefault(); 
    if ($(this).data("clicked")) { 
     return; 
    } 
    $(this).data("clicked",true); 
    console.log("Do Stuff"); 
    setTimeout(function(){ 
     $(this).data("clicked",false); 
    },1000); 
}).data("clicked",false); 

Answer 4

試試這個：

$(function(){ 
    var currentTime = (new Date()).getTime(); 
    $("input:button").click(function(){ 
     var nowTime = (new Date()).getTime(); 
     var diff = Math.abs((nowTime - currentTime)/1000); 

     if(diff < 1) 
      return; 

     currentTime = nowTime; 

     // do your stuff 
    }); 
});