检测页面是否完成加载
有没有一种方法来检测一个页面已经完成加载，即所有的内容，JavaScript和资产，如CSS和图像？
如此：
if(PAGE HAS FINISHED LOADING) { // do something amazing } 另外如果页面已经加载超过1分钟，然后做一些其他的事情，如：
if(PAGE HAS BEEN LOADING FOR 1 MIN) { // do something else amazing }
我已经看到像苹果的MobileMe这样的网站做类似的检查，但还没有能够在他们庞大的代码库中find它。
谁能帮忙？
谢谢
编辑：这基本上是我想要做的：
// hide content $("#hide").hide(); // hide loading $("#loading").hide(); // fade in loading animation setTimeout($('#loading').fadeIn(), 200); jQuery(window).load(function() { $("#hide").fadeIn(); $("#loading").fadeOut(function() { $(this).remove(); clearInterval(loadingAnim); }); setTimeout(function() { $("#error").fadeIn(); }, 60000); });
jQuery(window).load(function () { alert('page is loaded'); setTimeout(function () { alert('page is loaded and 1 minute has passed'); }, 60000); });
或http://jsfiddle.net/tangibleJ/fLLrs/1/
有关jQuery（window）.load的解释，另请参阅http://api.jquery.com/load-event/ 。
更新
关于如何加载JavaScript的详细解释和两个事件DOMContentLoaded和OnLoad可以在这个页面上find。
DOMContentLoaded ：当DOM准备好被操纵。 jQuery捕获这个事件的方法是使用jQuery(document).ready(function () {}); 。
OnLoad ：当DOM准备就绪时，所有资源 （包括图像，iframe，字体等 ）已经加载完毕，并且旋转轮/小时类消失。 jQuery捕获这个事件的方法就是上面提到的jQuery(window).load 。
有两种方法可以在jQuery中执行此操作，具体取决于您要查找的内容。
使用jQuery你可以做到
-
/ /这将等待文本资产被调用之前加载（dom .. css .. js）
$(document).ready(function(){...}); -
/ /这将等待所有的图像和文本资产完成加载之前执行
$(window).load(function(){...});
这就是所谓的onload。 DOM准备实际上是为了onload在图像上等待的确切原因而创build的。 （前一段时间，来自Matchu的一个类似问题的答案。）
window.onload = function () { alert("It's loaded!") }
onload将等待文档中的所有资源。
链接到他解释的一切问题：
点击我，你知道你想要！
我认为最简单的方法是
var items = $('img, style, ...'), itemslen = items.length; items.bind('load', function(){ itemslen--; if (!itemlen) // Do stuff here });
编辑，有点疯狂：
var items = $('a, abbr, acronym, address, applet, area, audio, b, base, ' + 'basefont, bdo, bgsound, big, body, blockquote, br, button, canvas, ' + 'caption, center, cite, code, col, colgroup, comment, custom, dd, del, ' + 'dfn, dir, div, dl, document, dt, em, embed, fieldset, font, form, frame, ' + 'frameset, head, hn, hr, html, i, iframe, img, input, ins, isindex, kbd, ' + 'label, legend, li, link, listing, map, marquee, media, menu, meta, ' + 'nextid, nobr, noframes, noscript, object, ol, optgroup, option, p, ' + 'param, plaintext, pre, q, rt, ruby, s, samp, script, select, small, ' + 'source, span, strike, strong, style, sub, sup, table, tbody, td, ' + 'textarea, tfoot, th, thead, title, tr, tt, u, ul, var, wbr, video, ' + 'window, xmp'), itemslen = items.length; items.bind('load', function(){ itemslen--; if (!itemlen) // Do stuff here });
另外一个选项你可以检查document.readyState就好，
var chkReadyState = setInterval(function() { if (document.readyState == "complete") { // clear the interval clearInterval(chkReadyState); // finally your page is loaded. } }, 100);
从readyState页面的文档中，完成状态的摘要是
在文档加载时返回“加载”，一旦完成parsing，但仍然加载子资源，则为“交互式”，一旦加载，则“完成”。
一种select是使页面空白，包含less量的JavaScript。 使用脚本进行AJAX调用以获取实际的页面内容，并使成功函数将结果写入当前文档。 在超时function，你可以“做一些令人惊叹的事情”
近似伪代码：
$(document).ready(function(){ $.ajax url of actual page success:do something amazing timeout: do something else });
没有jquery或类似的东西，为什么不呢？
var loaded=0; var loaded1min=0; document.addEventListener("DOMContentLoaded", function(event) { loaded=1; setTimeout(function () { loaded1min=1; }, 60000); });
这是你想到的吗？
$("document").ready( function() { // do your stuff }
var pageLoaded=0; $(document).ready(function(){ pageLoaded=1; });
使用jquery： https ： //learn.jquery.com/using-jquery-core/document-ready/
在评论中提问的人员仅供参考，这正是我在项目中实际使用的情况：
function onLoad(loading, loaded) { if(document.readyState === 'complete'){ return loaded(); } loading(); if (window.addEventListener) { window.addEventListener('load', loaded, false); } else if (window.attachEvent) { window.attachEvent('onload', loaded); } }; onLoad(function(){ console.log('I am waiting for the page to be loaded'); }, function(){ console.log('The page is loaded'); });
