在觸發後禁用呼叫功能5秒鐘

我有一個按鈕，我想禁止發送調用jquery，而有一個功能「活躍」。在觸發後禁用呼叫功能5秒鐘

會發生什麼是，每次用戶點擊按鈕，計數器減1。然而，這會發生延遲，請參閱這裏的步驟;

點擊按鈕
按鈕被禁用
5秒後反被一個和按鈕變爲減少到啓用。

但是，現在的問題是，即使按鈕被禁用，用戶也可以點擊X次，然後計數器在5秒後減少X次。

意味着電話仍然通過。

看到這裏是我的嘗試沒有成功做到到目前爲止，可惜..

$(document).ready(function() { 

    var enabled=true; 

    $(".myButton").click(function(){ 

     if(enabled = true) { 

     setTimeout(function(){ 
      var i = document.getElementById('counter2'); 
      i.innerHTML = parseInt(i.innerHTML)-1; 
      $('.progress-bar').css("width", '+=' + '35px'); 
      $(".myButton").attr('disabled','enabled'); 
      $('.myButton').css('opacity', '1'); 
      var enabled=true; 
     },5000) 
     $(".myButton").attr('disabled','disabled'); 
     $('.myButton').css('opacity', '0.5'); 
     var enabled=false; 

     } else { } 

    }); 
});

來源

2015-05-02 Snowlav

我覺得你真的很接近，試圖從所有，但第一個聲明消除'var'第2行，您在新的功能範圍定義具有相同名稱的新變量（'click'和'的setTimeout '回調） – Plato

剛剛嘗試過，但沒有成功:(它繼續做同樣的事情（加起來的點擊和減少所有的倒計時） – Snowlav

如果enabled = true？...只是說...在繼續閱讀 – Masterakos

if(enabled = true) { 
     ^

你的意思寫在這裏==。甚至更好：if (enabled)因爲enabled是一個布爾無論如何。使用= true這裏也是一項任務。並且由於true是真的，條件將總是評估爲true。

來源

2015-05-02 14:42:59 TimWolla

是的，這是在超時後缺少分號的問題。 – Snowlav

我不認爲你需要跟蹤一個變量來監視按鈕的狀態，因爲你已經設置了一個屬性來表明它已被禁用。所以你可以使用該屬性作爲狀態的一個指標。

此外，你正在做這種行爲所有類myButton的按鈕。所以我把處理程序隔離到只是點擊按鈕的event.target。

$(".myButton") 
    .prop('disabled',false) 
    .click(function(event){ 
     // get the button that was clicked. 
     var btn = $(event.target); 
     if(btn.prop('disabled') === true) { 
      // it's already disabled, nothing to do 
      return; 
     } 

     // start a 5 second timer 
     setTimeout(function(){ 
      var i = document.getElementById('counter2'); 
      i.innerHTML = parseInt(i.innerHTML)-1; 
      //$('.progress-bar').css("width", '+=' + '35px'); 
      // I've never seen += used like this ^^^ does it work? 
      var bar = $('.progress-bar'); 
      bar.css("width", (bar.width() + 35) + 'px'); 

      // after 5 seconds enable the button 
      btn.prop('disabled',false); 
      btn.css('opacity', '1'); 
     },5000); 

     // disable the button until timer expires. 
     btn.prop('disabled',true); 
     btn.css('opacity', '0.5'); 
    });

來源

2015-05-02 14:43:07 cgTag

在觸發後禁用呼叫功能5秒鐘

回答

相關問題