如何在 JavaScript 中防止多個「調整大小」事件觸發器？

管理多個「resize」事件觸發器

開發人員經常遇到在調整大小過程中處理「resize」事件的多個觸發器的問題。這可能會導致不良行為或效率低下。了解如何等待「調整大小」事件的「結束」對於確保只執行一次所需的操作至關重要。

如給定的程式碼範例所示，一個常見的方法是使用 $ (window).resize(function(){resizedw();}) 方法。但是，此方法在正在進行的調整大小過程中會多次觸發 resizedw() 函數。

為了克服這個問題，我們可以利用 setTimeout() 和clearTimeout() 方法。該策略允許我們在觸發 resizedw() 函數之前設定延遲。透過設定逾時（例如 100 毫秒），我們可以等待特定的時間以確保調整大小已完成。在此延遲期間，任何新的調整大小事件都會「重置」計時器，確保它僅在調整大小過程真正完成後執行。

以下程式碼範例說明了此方法：

function resizedw(){
    // Haven't resized in 100ms!
}

var doit;
window.onresize = function(){
  clearTimeout(doit);
  doit = setTimeout(resizedw, 100);
};

此程式碼範例可以在 jsfiddle 上找到，以方便您使用。

以上是如何在 JavaScript 中防止多個「調整大小」事件觸發器？的詳細內容。更多資訊請關注PHP中文網其他相關文章！