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。

Answer 1

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

您必须将console.log()来电置于$(window).load()区块内。这将在图像加载后运行。

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

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

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

加载活动信息：

在Google上发现更多信息：