Javascript safari中的$（window）.resize（）：为什么它在滚动窗口时也能工作（但不调整大小）？

我注意到，我的iphone5上安装了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

这是一个已知的错误，发生在ios6safari上。滚动时随机触发调整大小事件。幸好

解决类似问题也可能解决您的问题

对于懒惰的人：

张贴您应该“存储窗口宽度，并检查它是否已实际更改，然后再继续使用$（窗口）。调整大小功能”

他的代码片段：

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

    });

});

---

如您所见，在iphone/ipad和android设备中，当您向下滚动页面时，地址栏将变小，当滚动到顶部时，地址栏大小将返回到实际大小，此操作将触发window.resize event

此问题特定于ios，如果任何处理程序更改窗口中任何内容的大小，将触发resize event，有时它会陷入

无限调整大小调用中

。如上所述，有一个条件可以比较

以前的宽度

和

当前宽度

，如果两者相等，则返回。

在各种测试中，我几乎找到了解决方案！非常感谢。我不确定这是在哪个版本中引入的，但在Mobile Safari 7+中，当向上滚动页面时，Safari会最小化浏览器控件，从而导致视口大小发生变化。这个答案是我找到的唯一可行的答案。作为初始化的一部分，我现在只需将宽度、高度和方向存储在我的主名称空间中我不会称之为bug——浏览器正在调整视口的大小并重新渲染内容。在某些情况下，开发人员可能想解释这种行为，触发resize事件允许我们处理它。我们已经被宠坏太久了，假设调整大小总是与宽度的变化有关。现在我说内容在滚动时调整大小是没有意义的。我还想说，您可以通过在触发滚动事件后检查窗口宽度来处理任何大小调整问题。出于好奇，您能否举一个例子，说明由于滚动而触发的resize（）可以帮助Web开发人员处理某个问题？您声明，我们假设大小调整与宽度的更改有关，但部分情况下确实如此。调整文档视图大小时，将触发调整大小事件。我现在想知道滚动是如何调整文档视图的大小的。这听起来很合乎逻辑，现在我可以理解为什么iOS 9上仍然会出现这种情况