複製代碼代碼如下:
<! Doctype HTML公共“ - // W3C // DTD XHTML 1.0 Transitional // en”“” http://www.org/tr/tr/xhtml1/dtd/xhtml1-xhtml1-transitional.transitional.dtdd'>
<html xmlns =“ http://www.w3.org/1999/xhtml”>
<頭>
<meta http-equiv =“ content-type” content =“ text /html; charset = utf-8” />
<title> chrome下img加載對高度()的影響</title>
<style type =“ text/css”>
.floatleft {
浮子:左;
}
</style>
<script type =“ text/javascript” src =“ js/jquery-1.7.1.js”> </script>
<腳本類型=“ text/javascript”>
$(function(){
var img_h = $('。showimg')。 height();
var img_w = $('。showimg')。 width();
var text_h = $('。showText')。 height();
$('。showResult')。 html('showimg:' + img_w +'&' + img_h +'<br /> showtext:' + text_h);
警報('showimg:' + img_w +'&' + img_h +'<br /> showtext:' + text_h);
});
</script>
</head>
<! -
作者:北京-南宮
日期:2012-07-25
- >
<身體>
<div>
<div>
<img src =“ images /flash_pic.gif” />
</div>
<div>
這是文字
</div>
<div>
這裡顯示結果。
</div>
</div>
</body>
</html>
將此代碼在chrome運行,當,警報窗口彈出時,將會發現頁面的
運行結果如下:
這是文字
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()和高度()獲取到的img的寬高將為112px * 0
求助:希望哪位大俠有好辦法,能在不設置寬高情況下獲取到正確的值。 ,能在不設置寬高情況下獲取到正確的值。