Question

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


$('body').append('<div id="init"><img id="myimg" src="someimage.png" /></div>');
$('#init').hide();
$('#myimg').height(); // == 0
$('#myimg').width(); // == 0

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

祝你好运，大不了

Answer 1

我刚试过这个解决方案，你所做的不是依靠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 get method documentation

Answer 2

因为图片尚未加载.....

$('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/

Answer 3

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

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();

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

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

$('<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();
            });

Answer 9

看起来你需要计算身高;图像的宽度。如果是这样，那你就太难了。

在隐藏的div中获取图像的高度

9 个答案: