jQuery加载事件在Chrome浏览器返回零的宽度/高度值在弹出

jQuery load event in Chrome returns width/height values of zero in a popup

本文关键字：高度 事件 加载 Chrome 浏览器 jQuery 返回      更新时间：2023-09-26

从主页创建一个弹出窗口。打开，子/弹出页面使用onload事件，应该显示它的宽度/高度。然而，在Chrome中，这将始终导致0。检查窗口和文档的宽度/高度(使用或不使用jQuery)将只返回0。奇怪的是，在标签中加载子页面本身总是会正确报告宽度/高度。

这是正确的行为吗?加载事件是否有问题?铬吗?是否有另一个事件，我可以等待，以确保宽度/高度属性，特别是设置?

如果在onload中设置了超时，您可能会得到正确的值。但这似乎只是一个关于等待多长时间才能检查宽度/高度的猜测游戏。是否没有办法等待一个特定的事件知道肯定子窗口的宽度/高度在Chrome中设置?

下面两个页面的快速演示。希望有人可能有一些解决方案，其中不涉及猜测在一个不确定的时间量放入setTimeout

编辑:忘了说，我已经在Chrome版本14/15上测试过了。

main.html 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
    <head>
        <title>main</title>
    </head>
    <body>
        <input type="button" value="Pop" onclick="window.open('http://localhost:8085/social_test/test.html', 'namedWnd', 'width=320,height=240')" />
    </body>
</html>

test.html 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
    <head>
        <title>test</title>
        <script type="text/javascript" src="jquery-1.6.4.js"></script>
        <script type="text/javascript">
            $(window).load(function(){
                var report = function() {
                    alert($(window).width() + " x " + $(window).height());
                };
                report();
                //window.setTimeout(report, 1000);
            });
            // without any jquery
            /*window.onload = function() {
                var report = function() {
                    alert(window.innerWidth + " x " + window.innerHeight);
                    // or document's size
                    //alert(window.document.documentElement.clientWidth
                    //  + " x " + window.document.documentElement.clientHeight);
                };
                report();
                //window.setTimeout(report, 1000);
            };*/
        </script>
    </head>
    <body/>
</html>

为什么不用$(document)代替$(window): http://api.jquery.com/height/

我在自己的pop应用中使用过它，它可以工作，没有超时或任何东西

用$(document)代替$(window)可能并不总是正确的

解决方案:每个有(这样的)jQuery问题的人都应该直接指向重复检查DTD是否真的指向下面的DTDhttp://www.w3.org/TR/html4/loose.dtd

参考:http://bugs.jquery.com/ticket/12426

尝试:

$(document).load(function(){
    function report() {
        alert($(window).width() + " x " + $(window).height());
    };
    report();
});
相关文章：