添加到window.onload事件？ [英] adding to window.onload event?

问题描述

我想知道如果已经为
分配了方法调用，如何向window.onload事件添加另一个方法调用。

I'm wondering how to add another method call to the window.onload event once it has already been assigned a method call.

假设某处在脚本中我有这个任务......

Suppose somewhere in the script I have this assignment...

 window.onload = function(){ some_methods_1() };

然后在脚本中我有这个作业

and then later on in the script I have this assignment

 window.onload = function(){ some_methods_2() };

目前只有 some_methods_2 将是调用。有没有办法添加到以前的 window.onload 回调而不取消 some_methods_1 ？ （并且在同一功能块中也不包括 some_methods_1（）和 some_methods_2（）。

As it stands, only some_methods_2 will be called. Is there any way to add to the previous window.onload callback without cancelling some_methods_1 ? (and also without including both some_methods_1() and some_methods_2() in the same function block).

我想这个问题并不是关于 window.onload ，而是关于javascript的一般问题。我不想以某种方式为 window.onload 分配一些东西，如果另一个开发人员处理脚本并添加一段也使用 window.onload （不看我以前的代码），他会禁用我的onload事件。

I guess this question is not really about window.onload but a question about javascript in general. I DON'T want to assign something to window.onload in such a way that that if another developer were to work on the script and add a piece of code that also uses window.onload (without looking at my previous code), he would disable my onload event.

我也想知道同样的事情

  $(document).ready()

在jquery中。
我如何在不破坏之前的内容或之后可能发生的事情的情况下添加它？

in jquery. How can I add to it without destroying what came before, or what might come after?

推荐答案

如果你是使用jQuery，你不必做任何特别的事情。通过 $（document）.ready（）添加的处理程序不会相互覆盖，而是依次执行：

If you are using jQuery, you don't have to do anything special. Handlers added via $(document).ready() don't overwrite each other, but rather execute in turn:

$(document).ready(func1)
...
$(document).ready(func2)

---

如果您不使用jQuery，可以使用 addEventListener ，如Karaxuna所示，加上

---

If you are not using jQuery, you could use addEventListener, as demonstrated by Karaxuna, plus attachEvent for IE<9.

请注意 onload 不等于 $（文档）.ready（） - 前者等待CSS，图像......同样，后者仅等待DOM树。现代浏览器（以及IE9以来的IE）支持 DOMContentLoaded文档上的 事件，对应于jQuery ready 事件，但IE< 9不会。

Note that onload is not equivalent to $(document).ready() - the former waits for CSS, images... as well, while the latter waits for the DOM tree only. Modern browsers (and IE since IE9) support the DOMContentLoaded event on the document, which corresponds to the jQuery ready event, but IE<9 does not.

if(window.addEventListener){
  window.addEventListener('load', func1)
}else{
  window.attachEvent('onload', func1)
}
...
if(window.addEventListener){
  window.addEventListener('load', func2)
}else{
  window.attachEvent('onload', func2)
}

< hr>

如果两个选项都不可用（例如，你没有处理DOM节点），你仍然可以这样做（我使用 onload 作为示例，但其他选项 可用于 onload ）：

---

If neither option is available (for example, you are not dealing with DOM nodes), you can still do this (I am using onload as an example, but other options are available for onload):

var oldOnload1=window.onload;
window.onload=function(){
  oldOnload1 && oldOnload1();
  func1();
}
...
var oldOnload2=window.onload;
window.onload=function(){
  oldOnload2 && oldOnload2();
  func2();
}

或者，为了避免污染全局命名空间（并且可能遇到命名空间冲突），使用导入/导出IIFE模式：

or, to avoid polluting the global namespace (and likely encountering namespace collisions), using the import/export IIFE pattern:

window.onload=(function(oldLoad){
  return function(){
    oldLoad && oldLoad();
    func1();
  }
})(window.onload)
...
window.onload=(function(oldLoad){
  return function(){
    oldLoad && oldLoad();
    func2();
  }
})(window.onload)

这篇关于添加到window.onload事件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！