3

次のコードは、ドキュメントの正しいサイズを返しません。

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="./scripts/jquery-1.7.2.js"></script>
        <script>
            alert($(document).width());
        </script>
    </head>
    <body style="width:100%">
        <div style="width:100%" id="myappClientContainer">DEFAULT HTML</div>
    </body>
</html>

ウィンドウのコンテンツの幅を 320 に設定すると、アラートに 426 と表示されます。

たとえば、Internet Explorer 9.0.8112.16421 を使用すると、同じコードが正しくレポートされます。

これはChromeのバグですか？それともjQueryで？それとも何か？

ドキュメントのサイズ全体を埋めるためにドキュメント内に aを設定しようとしているときに、これに遭遇しましたdiv。おそらく、これはドキュメント全体のサイズを取得する正しい方法ではありませんか?

この問題を解決するにはどうすればよいですか?

更新 1:

以下のいくつかのアドバイスに従って、私はこれを両方試しました：

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="./scripts/jquery-1.7.2.js"></script>
        <script>
            function sizeme() {
                alert($(document).width());
            }
        </script>
    </head>
    <body style="width:100%" onload="sizeme()">
        <div style="width:100%" id="myappClientContainer">DEFAULT HTML</div>
    </body>
</html>

この：

<!DOCTYPE html>
<html>
    <head>
        <script>
            function sizeme() {
                alert($(document).width());
            }
        </script>
    </head>
    <body style="width:100%" onload="sizeme()">
        <div style="width:100%" id="myappClientContainer">DEFAULT HTML</div>

        <!-- YOUR jQuery SCRIPTS here before the '</body>' tag + load from Google (it's faster). -->
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
        <script>
            (function($){ // remap '$' to jQuery
                 alert($(document).width());
            })(jQuery);
        </script>
    </body>
</html>

しかし、私はまだ両方で間違ったサイズを取得しています( Chrome 18.0.1025.168 )。

jQuery 1.7.2 を使用しています。

4

5 に答える 5

2

完全なドキュメントの読み込みが完了する前にそれを実行しています。これを試して：

$(function(){
    alert($(document).width());
});
于 2012-05-05T20:57:32.603 に答える
0

「Div」要素はそれ自体で使用可能なすべての水平スペースを埋めるため、幅を定義する必要はありません。また$(document).width();、ドキュメントの幅をGETするだけの正しいアプローチです。

于 2012-05-05T20:57:24.390 に答える
0

試すdocument.body.clientWidth

わたしにはできる

于 2014-01-07T08:47:13.657 に答える
0

このようにすることをお勧めします：

<!DOCTYPE html>
<html>
<head>

<!-- OTHER JS LIBRARY/SCRIPTS -->
</head>     
<body style="width:100%">

<div style="width:100%" id="myappClientContainer">DEFAULT HTML</div>

<!-- YOUR jQuery SCRIPTS here before the '</body>' tag + load from google (it's faster) -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
    (function($){ // remap '$' to jQuery
         alert($(document).width());
    })(jQuery);
</script>

</body>
</html>

保存して Chrome で開きます。

于 2012-05-05T21:31:29.213 に答える