Question

是否有可靠的跨浏览器解决方案，以确定网站上的所有内容何时完成加载？由于我有很多要加载的东西（其中一些是在iframe中），这实际上并不起作用（即使浏览器的加载指示器仍在旋转，事件也会被触发）：

$(window).add('iframe').bind('load').promise().done(function() {
    alert('Too early :(');
});

Answer 1

我实际上正在使用它：

$(window).load(function () {
    // loading done, now perform for example animate/remove loader icon.
});

你可以在这里阅读更多相关信息：
http://api.jquery.com/load-event/

还有一个警告：

与图像一起使用时加载事件的注意事项

开发人员尝试使用.load（）快捷方式解决的常见挑战是在图像（或图像集合）完全加载时执行函数。应该注意有几个已知的警告。这些是：

它不能一致地工作，也不能可靠地跨浏览器      如果图像src设置为与之前相同的src，则它在WebKit中无法正确触发      它没有正确地冒泡DOM树      可以停止触发已经存在于浏览器缓存中的图像

我在现代浏览器上使用它，在mac / win上都没有找到任何问题

Answer 2

在iframe中只需使用并在顶层页面中创建该函数。

$(function(){
    parent.function();
});

找出所有内容何时真正完成加载

2 个答案: