javascript - $.height 在第一次加载页面时返回 0

Question

我在img页面上有以下内容

<img class="some-class" src="img/some-img.gif" style="top: 29px; left: 121px;">

在CSS中我有

img.some-class {
    display: inline-block;
    position: absolute;
}

img位于div有display: inline-block。

当我这样做console.log($img.height())时，它会在第一次加载页面时输出0（即在打开浏览器后第一次加载时）。仍然在我刷新页面后console.log($img.height())输出高度的真实值img。什么可能是问题的原因？

UPD。请注意，img 是动态添加的。

score 5 · Accepted Answer

在加载图像之前，浏览器不知道高度。当您第二次加载页面时，图像已经在浏览器缓存中，因此它知道高度。

您必须将console.log()呼叫放在一个$(window).load()块内。这将在图像加载后运行。

$(window).load(function() {
    console.log($('img#myimg').height();
});

如果图像是动态添加的，那么您可以load()在图像本身上放置一个处理程序：

$('img#myimg').load(function() {
    console.log($(this).height());
});

加载事件信息：

在谷歌上找到的更多信息：

1 回答 1