javascript - 窗口调整大小后触发函数

Question

我在$(window).resize(). 其中一个功能是一个包含大量 div 的复杂动画。

$window.resize(function() {
    // some functions
    doAnim();
}

这里的问题是，该resize()功能触发了很多。完成后是否可以触发一个功能resize()，它不会触发一百次？

干杯

Answer 1

所以，我相信这是一个类似的场景，当用户“输入”一些东西时：你不知道用户什么时候完成了一个句子，同样的，你不知道用户什么时候完成了调整大小；所以你可以做的是有一个可接受的间隔：

var idt;
$(window).resize(function() {
    if (idt) clearTimeout(idt);
    idt = setTimeout(doAnim, 500);
}

您还可以使用闭包来避免idt变量污染全局范围。

但是这里的要点是，每次用户调整窗口大小时，它都会设置一个超时并清除前一个：doAnim只有当用户离开窗口半秒而不调整窗口大小时，才会执行该函数。当然你可以设置自己的延迟。

Answer 2

You can achieve it as shown below. This will call when you finish with resizing :

        var myTimer;
        $(window).resize(function() 
        {
            // some functions
            var interval = 500;
            clearInterval(myTimer);
            myTimer = setInterval(function () { doAnim(); }, interval);
        });

        function doAnim() 
        {
            clearInterval(myTimer);
            alert('Resized');
        }