日期:2014-05-16  浏览次数:20452 次

JS获取不到隐藏的图片宽度?大家来帮忙看下。
是这样的,我在一个DIV内放了一张图片,这张图片是不固定的,所以我没有设置它的宽度。
然后要用JS获取它的宽度,可是DIV隐藏的话,宽度是0,
代码是这样的:

<div style="display:none;">
<img id="oImg" src="460.jpg" />
</div>
<script>
alert(document.getElementById('oImg').width)
</script>


然后我查了好久资料,听说把DIV设置成visibility:hidden;
我也设置了,在IE下是可以获取到宽度的,在火狐和谷歌浏览器都是0.

大家有什么办法呢。

------解决方案--------------------
图片加载后才能获取到高宽值,但是对于隐藏的图片,各浏览器下还是有差异:IE各版本均无法获取实际的高宽值,返回0,别的浏览器都能够获取图片的高宽值。
HTML code
<div style="display:none;">
    <img id="oImg" src="http://csdnimg.cn/www/images/csdnindex_logo.gif" />
</div>
<script type="text/javascript">
//兼容所有浏览器的方法
var obj = document.createElement('img');
obj.src = document.getElementById('oImg').src;
obj.onload = function() { alert(this.width); }
</script>

------解决方案--------------------
试试

<div style="display:none;">
<img id="oImg" src="http://csdnimg.cn/www/images/csdnindex_logo.gif" />
</div>
<input type="button" onclick="test()" value="测试" />
<script type="text/javascript">

var test = function(){
//兼容所有浏览器的方法
var obj = new Image;
obj.src = document.getElementById('oImg').src;
obj.complete ?
alert(obj.width) :
obj.onload = function() { alert(this.width); };
}
</script>