Question

我认为，我认为是一个奇怪的问题。我正在运行一个查找页面上最大图像的简单查询。这是一些测试数据 - 所有图像都是32x32，但其中一个尺寸为300x300。

<img src="app/assets/images/icons/blue.png" />
<img src="app/assets/images/icons/error.png"/>
<img src="app/assets/images/icons/info.png" height="300" width="300"/>

如果我运行这样的简单查询：

$('img').each(function(){
        console.log($(this).height());
    });

我会得到0,0,300 - 而不是32,32,300。

有人能指出我找到图像渲染大小的更好方法吗？

感谢。

Answer 1

如果图像是“原生”大小的，即HTML中没有宽度或高度，则需要等到图像加载后再知道它的大小。我用这个：

jQuery("img").each(function(){
    var img = jQuery(this);
    if (img.attr("complete")) {
        console.log(img.height());
    } else {
        img.load(function(){
            console.log(img.height());
        });
    }
});

Answer 2

确保在$(img).load()中准备好图像后执行此操作，然后它就能正常工作。尝试JavaScript验证：

function iLoad(isrc) {
var oImg = new Image();
oImg.src = isrc;
if (oImg.complete) {
window.alert(oImg.src + ' ' + oImg.width + ' x ' + oImg.height);

即使没有在HTML中设置，jQuery也能找到图像的高度

2 个答案: