Question

我发现在我的页面中调整大小的代码在设备的方向更改期间不止一次触发。怀疑这是由于页面模式期间发生页面滚动等其他事件从横向更改为纵向，反之亦然。我需要在窗口调整大小中编写逻辑但是它不止一次调用。我们有什么方法可以避免影响窗口调整大小的其他事件

Answer 1

在每个窗口调整大小期间，窗口调整大小事件会多次触发。正如Rory McCrossan在上面指出的那样，事件会在每个像素发生变化时触发一次。

一个选项是使用debounce函数，例如David Walsh所描述的函数：

https://davidwalsh.name/javascript-debounce-function

这是另一篇有用的文章，描述了限制和去抖动之间的区别：

https://css-tricks.com/the-difference-between-throttling-and-debouncing/

最后，您可以使用不太优雅（但同样有效）的方法来使用全局变量来跟踪您希望何时允许调整大小事件。

var ok_to_resize=true;
$(function(){
    $(window).resize(function(){
        if (ok_to_resize){
            //run your resize code
            ok_to_resize = false;
            setTimeout(function(){
                ok_to_resize = true;
            },500);
        }
    }); //END window.resize
}); //END document.ready

如何避免Windows调整大小触发多次由其他事件触发

1 个答案: