如何僅在調整大小事件完成後觸發操作？

等待「調整大小」事件結束以觸發操作

通常在使用響應式設計時，需要執行僅在調整大小過程完全完成後才執行操作。然而，使用 $(window).resize() 的傳統事件處理可能會在調整大小過程中觸發多個調用，從而導致不良行為。

解決方案：使用 setTimeout() 和clearTimeout()

為了實現所需的行為，可以結合使用 setTimeout() 和clearTimeout()。以下是範例：

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

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

這個方法利用計時器來延遲 resizedw() 函數的執行。當調整大小事件發生時，它會清除任何現有的計時器並啟動新的計時器。如果調整大小過程在 100 毫秒內繼續，則計時器將再次重設。只有當調整大小停止 100 毫秒時，才會呼叫 resizedw() 函數。

jsfiddle 上的範例：

有關此解決方案的工作範例，請參閱答案中提供的 jsfiddle 連結。

以上是如何僅在調整大小事件完成後觸發操作？的詳細內容。更多資訊請關注PHP中文網其他相關文章！