如何知道DIV中的所有元素是否已满载?

时间:2014-10-21 07:10:59

标签: jquery load

有一个div,其中会有一些元素(图像,iframe等)通过Ajax加载。在完全加载这些元素之后,我需要为div执行一个函数。

如何确定div中的所有元素是否已完全加载?

我使用jQuery作为库。

2 个答案:

答案 0 :(得分:8)

对于图片和iframe,您可以使用load事件:

// get all images and iframes
var $elems = $('#div').find('img, iframe');

// count them
var elemsCount = $elems.length;

// the loaded elements flag
var loadedCount = 0;

// attach the load event to elements
$elems.on('load', function () {
    // increase the loaded count 
    loadedCount++;

    // if loaded count flag is equal to elements count
    if (loadedCount == elemsCount) {
        // do what you want
        alert('elements loaded successfully');
    }
});

您应该在通过Ajax将元素附加到#div元素后执行上述脚本。

答案 1 :(得分:1)

请详细说明您的问题。不同类型的元素有不同的方法。

对于iframe,请关注此主题, How can I detect whether an iframe is loaded?

对于图像 http://api.jquery.com/load-event/

对于闪存,它取决于很多东西。 How can I tell if Flash is loaded on a website?