jQuery的延遲似乎並沒有給這類事件

Question

的我有一些幫助今天需要正確的延遲，這是我想出了：

 $(window).keypress(function (e) 
     { 
      if (e.keyCode == 13) 
      { 
       $('#doCheck') 
     .css('color', '#666') 
     .delay(100) 
     .queue(function (next) 
     { 
      $(this).css('color', '#00ff00'); 
      next(); 
     }); 

     doCheck('mark1'); 
     } 

<input id='doCheck' type="button" onclick="doCheck('mark1'); return false;" value="Mark" /> 

這裏的想法是，當用戶按下ENTER鍵，那麼按鈕的顏色將會改變顏色100毫秒，同時我會調用一個名爲doCheck的函數來調用AJAX。

我的問題是，在按鈕顏色變回＃666之前，似乎有一些最小延遲時間差不多一秒。我期望的時間要短得多，但即使我將延遲設置爲10，它似乎仍然會延遲1/2到1秒。我應該補充一點，如果我設置了五秒鐘的延時，那麼它確實會做五秒鐘。

我看不出這裏有什麼問題。

有沒有人有任何想法？

謝謝，

這裏是doCheck功能。該功能正常工作。只是按鈕的事情給我的問題。請注意，我只是將其更改爲異步：true

function doCheck(task) 
     { 
      var parms = { 
       task: task, 
       pk: $('#Q_PartitionKey').val(), 
       rk: $('#Q_RowKey').val(), 
      }; 
      $.ajax({ 
       type: "POST", 
       traditional: true, 
       url: '/power/check', 
       async: true, 
       data: parms, 
       dataType: "json", 
       success: function (data) 
       { 
        // $('#doCheckMark').attr("disabled", false); 
        // $('#doCheckMark').css("color", "#000"); 
       }, 
       error: function() 
       { 
        var cdefg = data; 
       } 
      }); 
     } 

Answer 1

是doCheck做同步呼叫嗎？如果是這樣，排隊的函數將不會被調用，直到你的ajax調用返回......這可能會導致意外的延遲。

修復將確保doCheck使用正確的異步調用。

Answer 2

因此，您似乎想要更改顏色，然後等待一段時間並將其更改回來。不需要隊列。

$(window).keypress(function (e) 
    { 
     if (e.keyCode == 13) 
     { 
      $('#doCheck') 
      .css('color', '#666') 
      .delay(100) 
      .css('color', '#00ff00'); 

      doCheck('mark1'); // make sure ajax only runs when correct keycode is pressed 
     } 
    } 

我很好奇，如果你想把這個效果附加到ajax調用本身或所有來自頁面的ajax請求。如果是這樣，請嘗試將顏色效果綁定到ajax請求或使用ajaxStart或ajaxStop。

Answer 3

這個怎麼樣？

$(window).keypress(function (e) 
{ 
      if (e.keyCode == 13) 
      { 
       $('#doCheck').css('color', '#00ff00'); 
       setTimeout(function(){ 
        $('#doCheck').css('color', '#666'); 
       },100); 

       doCheck('mark1'); 
      } 
}); 

Answer 4

你已經找到了解決方案，但請良好做法的愛，你的在線「點擊」更改爲jQuery的pub/sub模型。

這裏是一個example on how to do pub/sub jQuery event handling