如何附加到window.onload？答案

【问题标题】：How to append to window.onload?如何附加到window.onload？
【发布时间】：2013-09-07 10:16:09
【问题描述】：

我有一个函数foo，我想将它添加到window.onload，但是我的问题是已经有另一个函数bar 设置为window.onload。我怎样才能获得这两个功能。我无权更改 bar 如何添加到 window.onload 的逻辑，因此我不能使用范式 addEvent(…) 。在所有情况下都可以使用以下内容吗？

<script>
$(window).load(foo(){
//my code here
});
</script>

//lots of html
//potentially this happens before or after my above script

<script>
window.onload = bar();
otherFunction(){
//other function code here
};
</script>

【问题讨论】：

标签： jquery html

【解决方案1】：

这不是问题，因为您使用的是 jQuery。您可以多次调用$(window).load(...)，它不会删除之前绑定的事件处理程序。

这个函数接受一个匿名函数作为参数，一旦加载事件被触发就会执行。例如

$(window).load(function() {alert('the window has loaded');});

.load() 处理程序的 JQuery 文档：https://api.jquery.com/load-event。

作为参考，等效的“香草”JS 将使用window.addEventListener。

更新

使用.on('load,' 代替.load 事件：

$(window).on('load', function() { alert('This is better'); });

更多信息请参见https://stackoverflow.com/a/37915907/361842。

【讨论】：

谢谢，这让我感觉更好并解决了我的问题。我会在五分钟内接受你的回答

【解决方案2】：

无法附加函数，但您可以使用addEventListener，然后为load 事件注册多个函数：

window.addEventListener("load",a);
window.addEventListener("load",b);
function a(){
  alert("one");
}
function b(){
  alert("two");
}

【讨论】：

鉴于 OP 使用的是 jQuery，没有理由与 addEventListener 混淆。

【解决方案3】：

<!doctype html>

<html>
  <head>
    <meta http-equiv='content-type' content='text/hmtl; charset=utf-8'/>
    <script type='text/javascript'>
      window.addEventListener("load",foo);
      window.addEventListener("load",bar);
      function foo(){
        alert("this");
      }
      function bar(){
        alert("that");
      }
    </script>

  </head>

  <body>

  </body>
</html>

【讨论】：

你为什么要减去我？更好的解决方案是在加载时调用类似“initPage()”的函数，然后调用你想要的任何函数