如何在 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中文网其他相关文章！