加快jQuery的延遲（）與停止（）

我有三個按鈕：

<button>Button A</button> 
<button>Button B</button> 
<button>Button C</button>

每個按鈕觸發一些AJAX來提取數據，並根據迴應做出反應。

如果沒有返回數據，則顯示錯誤警報，延遲褪色，就像這樣：

if (no_data) 
{ 
    $error.show().delay(6000).fadeoutOut("slow"); 
} 
else 
{ 
    // we have data, do some stuff 
}

所以，如果按鈕B返回數據，並顯示報警了，我趕緊點擊按鈕C確實有數據，錯誤警報會一直保留到延遲完成時爲止，這並非意圖。

我嘗試添加一個隱藏功能的其他塊：如果它顯示

if (no_data) 
{ 
    $error.show().delay(6000).fadeOut("slow"); 
} 
else 
{ 
    $error.hide(); // we don't want the alert to keep showing 

    // we have data, do some stuff 
}

大，所以現在查詢成功刪除警報。然而，如果（如上所述），我單擊按鈕B，出現錯誤（觸發警報），然後單擊按鈕C，警報被刪除...然後再次點擊按鈕B（快速），前一個延遲是仍然在動畫隊列中並幾乎立即刪除警報。

有沒有一種方法，使得：

if (no_data) 
{ 
    $error.show().delay(6000).fadeOut("slow"); 
} 
else 
{ 
    // kill the previous fadeOut, then... 

    $error.hide(); 

    // do other stuff 
}

我試着將停止功能：

$error.stop(true, true).hide();

但它仍然沒有出現工作。我認爲這是因爲延遲導致隊列中沒有動畫，所以停止功能從不會真正刪除任何內容。

我在做什麼錯？

來源

2014-07-14 skippr

什麼只是禁用按鈕或者錯誤清晰，或將顯示一個新的錯誤，直到？ –

我不希望用戶必須支付等待處罰。 – skippr

的setTimeout（）和clearTimeout（）可以解決這個問題：

var $a = $('#btn-a'); 
    var $b = $('#btn-b'); 
    var $c = $('#btn-c'); 
    var $x = $('#alert'); 
    var timerHandle; 

    $a.on('click', function (e) { 
     $x.show(); 
     timerHandle = setTimeout(function() { 
      $x.fadeOut("slow");; 
     }, 6000); 
    }); 

    $b.on('click', function (e) { 
     $x.show(); 
     timerHandle = setTimeout(function() { 
      $x.fadeOut("slow");; 
     }, 6000); 
    }); 

    $c.on('click', function (e) { 
     $x.hide(); 
     clearTimeout(timerHandle); 
    });

來源

2014-07-14 21:44:47

對於讀這個的其他人，請注意隊列清除和'stop（）'不能與'delay（）'一起工作。起初沒有意識到確切的問題，這就解釋了爲什麼我找不到關於它的任何問題:) – skippr

你試過用dequeue（）來打破delay（）函數嗎？

你可以嘗試這樣的事：

if (no_data){ 
    $error.show().delay(6000).fadeOut("slow"); 
}else{ 
    // kill the previous fadeOut, then... 

    $error.dequeue(); 

    // do other stuff 
}

在你的代碼，它應該是這樣的：

$c.on('click', function(e) { 
    $x.hide(); 
    $x.dequeue(); 
});

這麼說，我認爲它可能會更好，有一個狀態機您可以跟蹤所顯示錯誤的狀態，並在錯誤淡出事件完成時僅啓用按鈕A，B和C.當沒有顯示錯誤時，您可以啓用按鈕，但當檢測到錯誤時，您可以使用setTimeout功能禁用6000ms時間的按鈕。

來源

2014-07-14 21:31:17

加快jQuery的延遲（）與停止（）

回答

相關問題