加载嵌套图像后查找元素高度的一致方法

时间:2012-11-21 09:17:57

标签: jquery image ready

我有一个div.body,其中包含img个元素。

我需要在加载div.body后获得img的高度。

我目前正在使用以下内容进行衡量:

var $body = $("div.body");
$body.find("img").ready(function(){
   var bodyHeight = $body.outerHeight();
});

这会在90%的时间内返回正确的高度,但有时会返回不包括图像高度的高度。


例如,如果div.body中的其他元素总和为50px,而我的图片的高度为150px,我需要获得200px,但有时候这只是返回50px


这是为什么?仅在图像加载后才能调用.ready()函数吗?

我应该使用其他方法吗?

图像可用后,运行此代码的100%一致方式是什么?

2 个答案:

答案 0 :(得分:3)

.ready()在加载整个页面的DOM时运行。你想要.load()

有关适用于动态添加内容的实现,请参阅讨论部分here

答案 1 :(得分:0)

根据jQuery的文档,有一些注意事项可以将load事件与图像一起使用。

看看这里:

jQuery event for images loaded

在这里:

https://github.com/desandro/imagesloaded