获取隐藏div中的图像高度

我想在隐藏的div- .height()获取图像的高度/宽度，但.height()和.width()都返回0（如预期的那样）。

 $('body').append('
'); $('#init').hide(); $('#myimg').height(); // == 0 $('#myimg').width(); // == 0 

如何获得正确的图像高度/宽度？ 我需要它做出一些决定:-)

最好的问候，Biggie

Answer 1

因为图像还没有加载…..

 $('body').append('
'); $('#init').hide(); $('#myimg').bind("load",function(){ alert(this.height) //works })​ 

继续测试： http ： //jsfiddle.net/WMpSy/

Answer 2

我刚刚遇到了解决方案，你所做的不是依赖jQuery来为你做这件事。 相反，获取javascript元素并获取元素本身的高度，如下所示：

 var img = hiddenDiv.children('img'); var imgHeight = img.get(0).height; var imgWidth = img.get(0).width; 

jQuery方法get(0)允许我们获取底层DOM元素，有趣的是，DOM元素维度不会改变。

但需要注意的是，出于性能原因，如果您打算再使用它，则需要缓存img.get(0) 。

jQuery获取方法文档

Answer 3

如果你想要正确的高度和宽度，你不能隐藏它，但你可以移动它，使它不在屏幕外，从而有效地隐藏。 试试这个：

 var hiddenDiv = $('
').appendTo('body').css({ 'position': 'absolute', 'top': -9999 }); var img = hiddenDiv.children('img'); img.height(); img.width(); 

Answer 4

使div暂时可见以计算高度或隐藏div off屏幕而不是使用display：None。 我使用了第一种方法，发现它足够快，你永远不会看到元素。

Answer 5

我有类似的问题。 问题是，如果包含图像的图像或div具有style =“display：none”，则其css height = 0。 我发现height（）和width（）函数给出了错误的值，例如0！ 我的解决方案是确保图像的属性设置如此，即使它们被隐藏，值仍然可以访问。 所以使用：

$（’＃testImg’）。attr（’height’）和$（’＃testImg’）。attr（’width’）来获取图像的高度和宽度。

Answer 6

你必须使用find（）

 $('body').find('#myimg').width(); 

要么

 $('body').find('#myimg').attr("width"); 

因为你在加载DOM后附加了它

Answer 7

我不确定你能用jQuery（或者javascript）来做。 我有一个类似的问题，错误的加载/隐藏img的高度和宽度。 但是，你可以等到图像加载，得到正确的高度和宽度，然后隐藏父…就像这样：

 var height, width; $('#myimg').load(function() { height = $(this).height(); width = $(this).width(); $('#init').hide(); } 

Answer 8

是的，因为图像尚未加载，这是我的解决方案：

 $('').appendTo('body').css({ 'position': 'absolute', 'top': -1 }).load(function() { console.log('Image width: ' + $(this).width()); console.log('Image height: ' + $(this).height()); $(this).remove(); }); 

Answer 9

看起来你需要计算图像的高度和宽度。 如果是这样，你会想到它太难了。