我想在隐藏的 div 容器中获取图像的高度/宽度，但 .height() 和 .width() 都返回 0（如预期的那样）。
$('body').append('<div id="init"><img id="myimg" src="someimage.png" /></div>');
$('#init').hide();
$('#myimg').height(); // == 0
$('#myimg').width(); // == 0
如何获得正确的图像高度/宽度？我需要它来做一些决定:-)
最好的问候， 大佬
【问题讨论】：
标签： jquery
是的，因为图像尚未加载，这是我的解决方案：
$('<img src="My Image URL" />').appendTo('body').css({
'position': 'absolute',
'top': -1
}).load(function() {
console.log('Image width: ' + $(this).width());
console.log('Image height: ' + $(this).height());
$(this).remove();
});
【讨论】：
我遇到了类似的问题。问题是，如果包含图像的图像或 div 具有 style="display:none" 则其 css 高度 = 0。我发现 height() 和 width() 函数给出了错误的值，例如 0！ 我的解决方案是确保图像设置了它们的属性，因此即使它们被隐藏，值仍然可以访问。所以使用：
$('#testImg').attr('height') 和 $('#testImg').attr('width') 获取图片的高度和宽度。
【讨论】：
我刚刚遇到了这个解决方案，你所做的是而不是依赖 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)，则需要缓存它。
【讨论】：
因为图片还没有加载.....
$('body').append('<div id="init"><img id="myimg" src="something.png" /></div>');
$('#init').hide();
$('#myimg').bind("load",function(){
alert(this.height) //works
})
这是一个测试：http://jsfiddle.net/WMpSy/
【讨论】：
我不确定您是否可以使用 jQuery（或根本没有 javascript）来做到这一点。我在加载/隐藏img 时误报了高度和宽度，我遇到了类似的问题。但是，您可以等到图像加载后，获得正确的高度和宽度，然后隐藏父级......就像这样：
var height, width;
$('#myimg').load(function() {
height = $(this).height();
width = $(this).width();
$('#init').hide();
}
【讨论】：
你必须使用 find()
$('body').find('#myimg').width();
或
$('body').find('#myimg').attr("width");
因为你是在加载 DOM 之后添加的
【讨论】：
看起来您需要计算图像的高度和宽度。如果是这样，你想得太多了。
【讨论】：
如果您想要正确的高度和宽度，则无法隐藏它，但您可以将其移动到屏幕之外，从而有效地隐藏它。试试这个：
var hiddenDiv = $('<div id="init"><img id="myimg" src="someimage.png" /></div>').appendTo('body').css({
'position': 'absolute',
'top': -9999
});
var img = hiddenDiv.children('img');
img.height();
img.width();
【讨论】：
display: none 元素确实有高度——输入$('#answer-3761104').hide().height() 给出了正确的高度——所以这个答案是完全错误的。
image load event。
使 div 暂时可见以计算高度或将 div 隐藏在屏幕外，而不是使用 display: None。我使用了第一种方法，发现它足够快，你永远看不到元素。
【讨论】：