复制代码代码如下:
<! Doctype html public "- // w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<adal>
<meta http-equiv = "contenu-type" contenu = "text / html; charset = utf-8" />
<Title> Chrome 下 img 加载对 hauteur () 的影响 </Title>
<style type = "text / css">
.floatleft {
flottant: à gauche;
}
</ style>
<script type = "text / javascript" src = "js / jquery-1.7.1.js"> </ script>
<script type = "text / javascript">
$ (function () {
var img_h = $ ('. showImg'). hauteur ();
var img_w = $ ('. showImg'). width ();
var text_h = $ ('. showText'). hauteur ();
$ ('. showResult'). html ('showImg:' + img_w + '&' + img_h + '<br /> showText:' + text_h);
alert ('showImg:' + img_w + '&' + img_h + '<br /> showText:' + text_h);
});
</cript>
</ head>
<! -
作者 ： 北京 - 南宫
日期 ： 2012-07-25
->
<body>
<div>
<div>
<img src = "images / flash_pic.gif" />
</div>
<div>
这是文字
</div>
<div>
这里显示结果。
</div>
</div>
</docy>
</html>
将此代码在 Chrome 运行 ， 当 Alerte 窗口弹出时 ， 将会发现页面的 IMG 并没有加载。
：
这是文字
showImg: 112 & 0
ShowText: 18
1 、此处 IMG 的默认宽度为 112 ， 但是我链接的 IMG 的宽度为 1000,
2 、此处 IMG 的高度为 0,
现做如下改动
复制代码代码如下:
<img src = "images / flash_pic.gif" />
：
这是文字
showImg: 1000 & 0
ShowText: 18
img 的高度仍旧为 0
当为其设置高度之后 ， 就可以正常获取到。
结论: 在 Chrome 下 ， IMG 不设置宽高 ， 通过 jQuery 的 Width () 和 Height () 获取到的 img 的宽高将为 112px * 0
求助 ： 希望哪位大侠有好办法 ， 能在不设置宽高情况下获取到正确的值。