$(window).resize()在Safari中为什么在滚动窗口时也能工作（但不会调整大小）？

Question

我注意到，使用我的iPhone 5上的Safari时，

$(window).resize()

它的工作方式很奇怪...

我有这段代码：

$(document).ready(function () {
 $(window).resize(function() {
     avviaChart();
     initialize();
     if($('#time').is(':checked')){ 
         $("#time").removeAttr('checked');
         $("#Time").css('border','2px solid #ffffff');
     }  
  });   
});

只有在窗口大小改变时，此代码才应该起作用......在其他浏览器中表现非常好，但在Safari中，即使我滚动页面（而窗口大小没有改变），代码也能起作用......

这怎么可能？O.o

- Mapsism Borja

---

可能是iphone/ipad触发意外的调整事件的重复问题。 - Rizky Fakkel

Answer 1

这是一个已知的问题，在iOS6 Safari中发生。在滚动时，调整大小事件会随机触发。幸运的是，这不是一个jQuery的问题。

这个答案 对于一个类似的问题也有可能解决你的问题。

如果你懒得自己看:

3Stripe发表了他应该"存储窗口宽度，并检查它是否实际改变，然后再执行$(window).resize函数"

他的代码片段:

jQuery(document).ready(function($) {

    /* Store the window width */
    var windowWidth = $(window).width();

    /* Resize Event */
    $(window).resize(function(){
        // Check if the window width has actually changed and it's not just iOS triggering a resize event on scroll
        if ($(window).width() != windowWidth) {

            // Update the window width for next time
            windowWidth = $(window).width();

            // Do stuff here

        }

        // Otherwise do nothing

    });

});

- Rizky Fakkel

---

在各种测试中，我已经接近解决方案了！谢谢！ - Mapsism Borja

我不确定这是在哪个版本中引入的，但在移动Safari 7+中，向上滚动页面时，Safari会最小化浏览器控件，从而导致视口大小发生变化。这个答案是我找到的唯一可行的答案。现在，我只需将宽度、高度和方向作为初始化的一部分存储在我的主命名空间中。 - Craig Jacobs

很高兴能帮助到你，克雷格！ :) - Rizky Fakkel

我不会称之为一个 bug - 浏览器正在调整视口并重新渲染内容。有些情况下，开发人员可能希望考虑到这种行为，并触发一个 resize 事件来处理它。我们已经太习惯于假设 resize 总是与宽度的变化有关了。 - Anthony Manning-Franklin

现在对我来说，说内容在滚动时会调整大小没有意义。我还会说，您可以通过检查滚动事件触发后的窗口宽度来处理任何调整大小问题。出于好奇，您能否举出一个示例，其中由于滚动而触发的resize()有助于Web开发人员解决某个问题？您声明我们假设调整大小与宽度变化有关，但它部分如此。当文档视图调整大小时，将触发调整大小事件。我目前想知道滚动如何调整文档视图的大小。 - Rizky Fakkel

我已经尝试过这个，但它无法解决我的问题。 - Ankur Gupta

Answer 2

正文：正如你所看到的，在iPhone/iPad和Android设备上，当你向下滚动页面时，地址栏会变小，当滚动到顶部时，地址栏大小会恢复到实际大小，这个操作会触发window.resize事件。

- Mohammad Rezaei

---

这听起来很合理，现在我明白为什么这仍然会发生在iOS 9上。 - bluantinoo

Answer 3

这个问题只针对iOS，如果有任何处理程序改变窗口中任何东西的大小，都会触发调整大小事件，并且有时会陷入无限调整大小调用中。因此，如上所述，有一个条件来比较先前的宽度和当前的宽度，如果两者相等，则返回。

- Bhagwati Malav