刪除延遲（）點擊事件

Question

我有一個面板誰13秒後自動滑動。我用jquery.delay（）做了這個。 如果我想通過單擊事件手動滑動面板，則會出現此問題。看起來，點擊事件正在等待延遲的效果結束。

我可以用什麼來代替delay（）？

我的代碼：

延遲部分：

$('#menu').delay(13000).hide("slide", { direction: "right" }, 400, function() { 
      if ($('#menu').is(':hidden')) { 
       $('#trigger').removeClass("triggerdroiteExtended"); 
       $('#trigger').addClass("triggerdroiteCollapsed"); 
       $.cookie('rightfold', 'collapsed', { path: '/' }); 
      } 
     }); 

Click事件部分：

$('#triggerdroite').click(function() { foo 
}); 

Answer 1

這是你可能會更好過使用setTimeout和clearTimeout的地方。從delay docs：

.delay()方法是最好的延遲排隊的jQuery效果。因爲它是有限的  — 它不提供取消延遲的方法 — .delay()不是JavaScript的原生setTimeout函數的替代品，它可能更適合某些用例。

（我的重點。）

因此，在這種情況下：

(function() { 
    var slideTimer = 0; 
    slideTimer = setTimeout(function() { 
     $('#menu').hide("slide", { direction: "right" }, 400, function() { 
       if ($('#menu').is(':hidden')) { 
        $('#trigger').removeClass("triggerdroiteExtended"); 
        $('#trigger').addClass("triggerdroiteCollapsed"); 
        $.cookie('rightfold', 'collapsed', { path: '/' }); 
       } 
      }); 
    }, 13000); 
    $('#triggerdroite').click(function() { 
     if (slideTimer) { 
      clearTimeout(slideTimer); 
      slideTimer = 0; 
     } 

     // ... 
    }); 
})(); 

（外匿名函數只是一個佔位符，我假設你的代碼是已經有一些功能，防止內部創建全局變量）。

注意我使用0作爲「無定時器運行」值。 0不是setTimeout的有效返回值，所以它是一個有用的標誌。

當然，不是像上面那樣將它存儲在一個變量中，而是可以使用data將它存儲在#menu元素本身上。