使用JS附加body onload事件

时间:2009-08-05 21:59:01

标签: javascript html events onload

如何以跨浏览器的方式使用JS附加正文onload事件?这么简单吗?

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

7 个答案:

答案 0 :(得分: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;

答案 1 :(得分:21)

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

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

如果我没弄错的话,那就是所有浏览器兼容。

答案 2 :(得分:14)

跨浏览器window.load事件

function load(){}

window[ addEventListener ? 'addEventListener' : 'attachEvent' ]( addEventListener ? 'load' : 'onload', load )

答案 3 :(得分:9)

document.body.onload是一种跨浏览器,但是只允许单个回调的传统机制(您无法为其分配多个功能)。

Internet Explorer不支持最接近的“标准”替代方法addEventListener(它使用attachEvent),因此您可能希望使用库(jQuery,MooTools,prototype.js等) 。)为你抽象跨浏览器的丑陋。

答案 4 :(得分:2)

jcalfee314的想法对我有用 - 我有window.onload = onLoad这意味着<body onload="...">中的函数没有被调用(我无法控制)。

这解决了它:

oldOnLoad = window.onload
window.onload = onLoad;

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

编辑:Firefox不喜欢oldOnLoad = document.body.onload;,因此替换为oldOnLoad = window.onload

答案 5 :(得分:-1)

您必须为不同的浏览器使用几种不同的方法。像jQuery这样的库为您提供了一个跨浏览器的界面,可以为您处理所有这些。

答案 6 :(得分:-3)

为什么不使用jQuery?

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

据我所知,这是一个完美的解决方案。