38

如何以跨浏览器的方式使用 JS 附加 body onload 事件？就这么简单？

  document.body.onload = function(){
      alert("LOADED!");
  }
4

7 回答 7

22

这利用了 DOMContentLoaded - 它在 onload 之前触发 - 但允许您坚持所有不引人注目的...

window.onload - Dean Edwards - 博客文章对此进行了更多讨论 - 这是从同一个博客的评论中复制的完整代码。

// Dean Edwards/Matthias Miller/John Resig

function init() {
  // quit if this function has already been called
  if (arguments.callee.done) return;

  // flag this function so we don't do the same thing twice
  arguments.callee.done = true;

  // kill the timer
  if (_timer) clearInterval(_timer);

  // do stuff
};

/* for Mozilla/Opera9 */
if (document.addEventListener) {
  document.addEventListener("DOMContentLoaded", init, false);
}

/* for Internet Explorer */
/*@cc_on @*/
/*@if (@_win32)
  document.write("<script id=__ie_onload defer src=javascript:void(0)><\/script>");
  var script = document.getElementById("__ie_onload");
  script.onreadystatechange = function() {
    if (this.readyState == "complete") {
      init(); // call the onload handler
    }
  };
/*@end @*/

/* for Safari */
if (/WebKit/i.test(navigator.userAgent)) { // sniff
  var _timer = setInterval(function() {
    if (/loaded|complete/.test(document.readyState)) {
      init(); // call the onload handler
    }
  }, 10);
}

/* for other browsers */
window.onload = init;
于 2009-08-05T22:11:11.607 回答
21

为什么不使用window自己的onload事件？

window.onload = function () {
      alert("LOADED!");
}

如果我没记错的话，这在所有浏览器中都是兼容的。

于 2009-08-05T22:08:11.177 回答
14

跨浏览器 window.load 事件

function load(){}

window[ addEventListener ? 'addEventListener' : 'attachEvent' ]( addEventListener ? 'load' : 'onload', load )
于 2012-09-17T13:55:30.897 回答
9

document.body.onload是一个跨浏览器，但是一个遗留机制，只允许一个回调（你不能分配多个函数给它）。

addEventListenerInternet Explorer 不支持最接近的“标准”替代方案（它使用attachEvent.

于 2009-08-05T22:11:31.327 回答
2

jcalfee314 的想法对我有用 - 我有一个window.onload = onLoad这意味着<body onload="...">没有调用其中的函数（我无法控制）。

这修复了它：

oldOnLoad = window.onload
window.onload = onLoad;

function onLoad()
{
oldOnLoad();
...
}

编辑：Firefox 不喜欢oldOnLoad = document.body.onload;，所以替换为oldOnLoad = window.onload.

于 2011-07-20T17:20:22.423 回答
-1

对于不同的浏览器，您必须使用几种不同的方法。不过，像 jQuery 这样的库为您提供了一个跨浏览器界面，可以为您处理这一切。

于 2009-08-05T22:02:40.347 回答
-4

为什么不使用 jQuery？

$(document).ready(function(){}))

据我所知，这是完美的解决方案。

于 2016-05-10T12:15:13.747 回答