jQuery在Chrome 18.0.1025.168中返回错误的宽度和高度 [英] jQuery returns wrong width and height in Chrome 18.0.1025.168
问题描述
以下代码没有返回正确的文档大小.
The following code does not return the correct size for the document.
<!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.
When I set the width of the content of the window to 320, the alert says 426.
例如，在使用Internet Explorer 9.0.8112.16421时，相同的代码可以正确报告.
The same code reports correctly when using Internet Explorer 9.0.8112.16421 for example.
这是Chrome的错误吗?还是使用jQuery?还是其他?
Is this a bug with Chrome? Or with jQuery? Or anything else?
在尝试在文档内部设置div来填充文档的整个尺寸时，我偶然发现了这一点，所以也许这不是获取整个文档尺寸的正确方法吗?
I have stumbled on this while trying to set a div inside a document to fill the entire size of the document, so maybe this is not the right way to get the dimensions of the entire document?
如何解决此问题?
更新1:
按照下面的一些建议，我已经尝试了这两种方法:
Following some advice below, I have tried both this:
<!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中是 ).
But I still get the wrong size in both of them (in Chrome 18.0.1025.168).
我正在使用jQuery 1.7.2.
I am using jQuery 1.7.2.
推荐答案
在Windows 8的Chrome版本33.0.1750.154 m上，我也遇到了同样的问题
I have the same issue on Chrome Version 33.0.1750.154 m on Windows 8
我的笔记本电脑显示屏的水平分辨率为:1366 px
My laptop display have a horizontal resolution : 1366 px
但是Chrome的水平分辨率(宽度)比笔记本电脑的硬件功能高.
However Chrome is returning a horizontal resolution (width) higher than the hardware capability of my laptop.
使用Jquery:
$( window ).width()返回1483像素
使用纯Javascript:
window.innerWidth返回1483像素
document.body.clientWidth返回1484像素
(这也不起作用)
结论: 由于普通的javascript返回与jquery相同的错误值， 这一定不是Jquery中的错误，而是Chrome中的错误.
Conclusion: Since plain javascript returns same wrong value as jquery, this must not be a bug in Jquery but in Chrome.
修改 Chrome浏览器是在我case.Though变焦出状态显示我的测试片100％的放大倍率，当我打开另一个选项卡，内容显得小，当检查(CTRL +，CTR - 在Windows上)有人缩小.将新标签重置为100％(ctrl 0 0n窗口)后，问题消失了.
Edit Chrome was in a zoom out state in my case.Though my testing tab shown 100% magnification, when I opened another tab, content appeared small, when checked (ctrl +, ctr - on windows) it was zoomed out. After resetting the new tab to 100% (ctrl 0 0n windows), The issue disappeared.
Firefox缩小时对我的行为相同.
Firefox behaves the same way when zoomed out for me.
这篇关于jQuery在Chrome 18.0.1025.168中返回错误的宽度和高度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
