窗口调整大小只工作一次答案

【问题标题】：window resize only works once窗口调整大小只工作一次
【发布时间】：2016-01-22 20:58:59
【问题描述】：

我在 window.resize 事件中有一个函数，它运行良好，除此之外它似乎只运行一次。如果用户再次调整窗口大小，则不会执行该函数。这是代码：

$(window).resize(function() {
   var wait = setInterval(function () {
       if (!$(currentBanner, loading).is(":animated")) {
           clearInterval(wait);
           loading.stop().fadeOut(300, function () {
               if ($('#banner').css('display') == 'block'){
                   setTimeout(function() {
                       bannerInit();
                   }, 800);
                   startInterval();
                   if (initialLoad) {
                       initialLoad = false;
                       next.slideDown();
                       previous.slideDown();
                   }
               }
           });
       }
   }, 200);
}).resize();

有人知道我如何确保每次调整窗口大小时都执行该函数吗？

【问题讨论】：

这仅在当前横幅加载动画时有效。因此，如果它只动画一次，那么它只工作一次。
@PraveenKumar 有一个否定符号，所以它应该在没有动画的情况下工作。
@TaReQMahMooD 我的意思是......好吧，对。 :)

标签： javascript html css

【解决方案1】：

我不知道你的意图是什么，但如果要在调整窗口大小后延迟执行，你应该将 setInterval 更改为 setTimeout

setInterval 是一个无限循环，一直运行直到您告诉它停止，并且 setTimeout 只执行一次，它会等待 x 毫秒才能执行。

另外，你不需要调用 'resize()' 事件，每次窗口大小因任何原因（用户调整大小或最大化等）改变时都会触发

$(window).on("resize",function() {
   var wait = setTimeout(function () {
       if (!$(currentBanner, loading).is(":animated")) {
           clearInterval(wait);
           loading.stop().fadeOut(300, function () {
               if ($('#banner').css('display') == 'block'){
                   setTimeout(function() {
                       bannerInit();
                   }, 800);
                   startInterval();
                   if (initialLoad) {
                       initialLoad = false;
                       next.slideDown();
                       previous.slideDown();
                   }
               }
           });
       }
   }, 200);
});

【讨论】：

【解决方案2】：

那是因为您在事件定义的末尾调用了.resize()。

尝试更改为：

$(window).resize(function () {
//....
});

$(window).resize();

【讨论】：

resize(..) 返回 Window 对象，所以这应该不是问题
@jgasiorowski 我测试了它，当最后有一个 .resize 时，除了第一次之外它不会调用该事件。
我测试了该代码，它运行良好 $(window).resize(function() { alert('Alert!Resize!'); }).resize(); （顺便说一句，我没有降级你的答案；））
@jgasiorowski hm，当我在 chrome 开发工具中运行它时它不起作用，我稍后会尝试更多。我不担心降级:)