如您所知，在 Internet Explorer 中，当页面上的任何元素调整大小时都会触发 window.resize 事件。页面元素是否通过分配/更改其高度或样式属性、通过简单地向其添加子元素或其他任何方式来调整大小都无关紧要——即使元素调整大小不会影响视口本身的尺寸。
在我的应用程序中，这会导致令人讨厌的递归，因为在我的 window.resize 处理程序中，我正在调整一些 <li> 元素的大小，这又会重新触发 window.resize 等。同样，这只是 IE 中的一个问题。
有什么方法可以防止 window.resize 在响应页面上的元素被调整大小时在 IE 中触发？
我还应该提到我正在使用 jQuery。
我刚刚发现了另一个可能对你有帮助的问题。
我正在使用 jQuery 并且我有 window.resize 事件来调用一个函数，该函数将重新定位附加到正文的 div。
现在，当我设置该附加 div 的 LEFT css 属性时，window.resize 事件会因为没有好的原因而触发。
它导致无限循环，一次又一次地触发 window.resize。
$(window).resize(function(){
var onResize = function(){
//The method which alter some css properties triggers
//window.resize again and it ends in an infinite loop
someMethod();
}
window.clearTimeout(resizeTimeout);
resizeTimeout = window.setTimeout(onResize, 10);
});
var winWidth = $(window).width(),
winHeight = $(window).height();
$(window).resize(function(){
var onResize = function(){
//The method which alter some css properties triggers
//window.resize again and it ends in an infinite loop
someMethod();
}
//New height and width
var winNewWidth = $(window).width(),
winNewHeight = $(window).height();
// compare the new height and width with old one
if(winWidth!=winNewWidth || winHeight!=winNewHeight){
window.clearTimeout(resizeTimeout);
resizeTimeout = window.setTimeout(onResize, 10);
}
//Update the width and height
winWidth = winNewWidth;
winHeight = winNewHeight;
});
所以基本上它会检查高度或宽度是否改变（这只会在你实际调整窗口大小时发生）。
这对我来说很有意义，并且似乎适用于 IE7 及更高版本：
//variables to confirm window height and width
var lastWindowHeight = $(window).height();
var lastWindowWidth = $(window).width();
$(window).resize(function() {
//confirm window was actually resized
if($(window).height()!=lastWindowHeight || $(window).width()!=lastWindowWidth){
//set this windows size
lastWindowHeight = $(window).height();
lastWindowWidth = $(window).width();
//call my function
myfunction();
}
});
绑定您的调整大小侦听器，.one()以便它在触发后解除绑定。然后你可以做任何你想做的事情，只要最后你重新绑定调整大小的监听器。我发现最简单的方法是将调整大小的侦听器放在一个匿名函数中，如下所示：
var resizeListener = function(){
$(window).one("resize",function(){ //unbinds itself every time it fires
//resize things
setTimeout(resizeListener,100); //rebinds itself after 100ms
});
}
resizeListener();
从技术上讲，您不需要将其setTimeout包裹起来，resizeListener()但我将它放在那里作为以防万一和一些额外的节流。
我通过取消绑定调整大小函数，重建页面，然后再次绑定调整大小函数来解决它：
function rebuild() {
$(window).unbind('resize');
/* do stuff here */
$(window).bind('resize',rebuild);
}
$(window).bind('resize',rebuild);
编辑
绑定和解除绑定不适用于 IE8。尽管 Microsoft 甚至放弃了 IE8，但您可能想尝试一下（未经测试！）：
function rebuild(){
if(!window.resizing) return false;
window.resizing=true;
/* do stuff here */
window.resizing=false;
}
window.resizing=false;
document.body.onresize=rebuild;
@AamirAfridi.com 的回答解决了我的问题。
编写一个通用函数来解决此类问题是个好主意：
function onWindowResize(callback) {
var width = $(window).width(),
height = $(window).height();
$(window).resize(function() {
var newWidth = $(window).width(),
newHeight = $(window).height();
if (newWidth !== width || newHeight !== height) {
width = newWidth;
height = newHeight;
callback();
}
});
}
像这样使用它，您就不必再担心 IE 中的不同行为了：
onWindowResize(function() {
// do something
});