2011-05-10 55 views
6

我发现了一个问题,似乎总是在IE8中打开一段html和javascript时重现。为什么IE8挂在jquery window.resize事件?

<html> 
    <body> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script> 
    <script> 
     $(document).ready(function(){ 
      $(window).resize(function() { 
       console.log('Handler for .resize() called'); 
      }); 
     }); 
    </script> 
    <div id="log"> 
    </div> 
    </body> 
</html> 

加载该文件在IE8和开放开发工具将显示该日志信息的浏览器窗口中的一个调整大小后连续打印。

有没有人有一个想法,为什么?这在IE7或IE9中不会发生,也不会在其他浏览器(或至少是其最新版本)中发生。

UPDATE

一个解决方案,以防止调整大小的连续的触发器()是添加处理程序上document.body.onresize如果浏览器IE8是。

var ieVersion = getInternetExplorerVersion(); 
    if (ieVersion == 8) { 
     document.body.onresize = function() { 
     }; 
    } 
    else { 
     $(window).resize(function() { 
     }); 
    } 

但是这不能回答我的问题:在IE8中是否继续触发resize()错误?

+0

无法在IE8中使用此fiddel重现此问题:http://jsfiddle.net/hrtp8/ – DanielB 2011-05-10 08:47:20

回答

3

如果“在拖动时显示窗口内容”打开,您将淹没调整大小事件。我想你正在单独的Windows机器上测试IE8,它启用了这种效果(显示属性 - >外观 - >效果...)。

为了解决这个问题,你可以用&陷阱调整大小事件,驯服他们:http://paulirish.com/demo/resize

这篇文章说的Chrome,Safari浏览器&歌剧从这个挨得过。

0

如果页面上的元素调整大小(as described in this question),我只能看到您描述的问题。你的例子对我来说不起作用,但我认为你会在log div中附加控制台消息,这意味着它正在调整div的大小并触发窗口大小调整事件。

Lee给出的答案是正确的,但链接中的方法对我无效。下面是我所做的:

var handleResize = function(){ 
    $(window).one("resize", function() { 
     console.log('Handler for .resize() called'); 
     setTimeout("handleResize()",100); 
    }); 
} 
handleResize(); 

这样,处理器只要它触发是绑定的,你已经完成了所有可能重新触发一个页面大小调整动作之后仅重新绑定。我投入setTimeout来提供额外的节流。如果您的脚本需要更多时间,请增加该值。