为什么jQuery会重启事件两次？

I just noticed that the jquery resize event fires twice any time the browser window is resized. I'm unable to find any documentation listing this as the default behavior. I have tested this in the latest versions of Chrome and Firefox, using jQuery 1.4 and 1.5.

我只是注意到，只要调整浏览器窗口大小，jquery resize事件就会触发两次。我找不到任何将此列为默认行为的文档。我已经使用jQuery 1.4和1.5在最新版本的Chrome和Firefox中对此进行了测试。

Does anyone else see this behavior? Is there a specific reason for it?

有没有人看到这种行为？它有具体原因吗？

Update: This happens if I click the maximize button on the browser window once. I understand that if I'm manually dragging the window to a different size, the event will be fired multiple times, but that shouldn't be the case with the maximize button.

更新：如果我单击浏览器窗口上的最大化按钮一次，就会发生这种情况。据我所知，如果我手动将窗口拖动到不同的大小，事件将被多次触发，但最大化按钮不应该是这种情况。

The code used test this is below. The browser resized text is output twice:

使用的代码测试如下。浏览器调整大小的文本输出两次：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title></title>
</head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.js"></script>
<script type="text/javascript">
    $(window).resize(function(){
        console.log('Browser Resized');
    });
</script>
<body>

</body>
</html>

4 个解决方案

#1

This is not a problem of jQuery. It depends on the browser implementation. The browser decides when to trigger 'resize'. And you can use window.onresize = function() {...} to test. It will be same. Nothing to do with jQuery. I tested on Win7 chrome, it is fired twice, and in Win7 opera/safari it's fired once.

这不是jQuery的问题。这取决于浏览器的实现。浏览器决定何时触发'调整大小'。您可以使用window.onresize = function（）{...}进行测试。它会是一样的。与jQuery无关。我测试了Win7 chrome，它被激发了两次，而在Win7 opera / safari中它被触发了一次。

#2

JQuery: How to call RESIZE event only once it's FINISHED resizing?

JQuery：只有在完成大小调整后才能调用RESIZE事件？

Shows at least others are having this issue. In 1.3.2 it was listed as a bug because of something with the events system: http://benalman.com/code/projects/jquery-resize/docs/files/jquery-ba-resize-js.html

显示至少其他人遇到此问题。在1.3.2中，由于事件系统的某些内容，它被列为bug：http：//benalman.com/code/projects/jquery-resize/docs/files/jquery-ba-resize-js.html

#3

Here's a simple solution to the problem using setTimeout.

这是使用setTimeout解决问题的简单方法。

jQuery

jQuery的

var resizeTimeout
$(window).resize(function(){
    clearTimeout(resizeTimeout)
    resizeTimeout = setTimeout(function(){
        console.log("resized")
    },100)
});

JavaScript

JavaScript的

var resizeTimeout
window.addEventListener("resize", function(){
    clearTimeout(resizeTimeout)
    resizeTimeout = setTimeout(function(){
        console.log("resized")
    },100)
})

#4

-1

I tested the present case, and I get two calls as well. So I think, etc... is this a bug, is it not, is it a before/after clustered function call... And I go back to JQuery ' documentation for resize() :

我测试了本案例，我也接到了两个电话。所以我认为，等等......这是一个错误，不是吗，它是一个在聚类函数调用之前/之后...我回到JQuery的文档来调整resize（）：

Code in a resize handler should never rely on the number of times the handler is called. Depending on implementation, resize events can be sent continuously as the resizing is in progress (the typical behavior in Internet Explorer and WebKit-based browsers such as Safari and Chrome), or only once at the end of the resize operation (the typical behavior in some other browsers such as Opera).

调整大小处理程序中的代码永远不应该依赖于调用处理程序的次数。根据实施情况，调整大小事件可以在调整大小正在进行时连续发送（在Internet Explorer和基于WebKit的浏览器（如Safari和Chrome）中的典型行为），或者仅在调整大小操作结束时发送一次（典型行为在其他一些浏览器，如Opera）。

Any other word necessary?

还有其他必要的词吗？

#1

#2