添加到window.onload事件?
我想知道如何添加另一个方法调用一旦它已经被分配了一个方法调用的window.onload事件。
假设脚本中的某处我有这个任务…
window.onload = function(){ some_methods_1() };
然后在脚本中,我有这个任务
window.onload = function(){ some_methods_2() };
就目前而言,只有some_methods_2
会被调用。 有没有办法添加到以前的window.onload
callback,而不取消some_methods_1
? (并且在同一个function块中也不包括some_methods_1()
和some_methods_2()
)。
我想这个问题不是关于window.onload
而是一个关于javascript的问题。 我不想给window.onload
分配一些东西,以至于如果另一个开发人员在脚本上工作,并添加一段也使用window.onload
的代码(而不是看我以前的代码),他会禁用我的onload事件。
我也想知道同样的事情
$(document).ready()
在jQuery中。 我怎样才能补充它而不破坏之前发生的事情,或者可能会发生什么?
如果你使用jQuery,你不必做任何特别的事情。 通过$(document).ready()
添加的处理程序不会相互覆盖,而是依次执行:
$(document).ready(func1) ... $(document).ready(func2)
如果你不使用jQuery,你可以使用addEventListener
,如Karaxuna所示,加上IE的attachEvent
<9。
请注意, onload
不等于$(document).ready()
– 前者等待CSS,图像…,而后者只等待DOM树。 现代浏览器(IE9以后的IE)支持文档上的DOMContentLoaded
事件,该事件对应于jQuery ready
事件,但IE <9不支持。
if(window.addEventListener){ window.addEventListener('load', func1) }else{ window.attachEvent('onload', func1) } ... if(window.addEventListener){ window.addEventListener('load', func2) }else{ window.attachEvent('onload', func2) }
如果这两个选项都不可用(例如,你不处理DOM节点),你仍然可以做到这一点(我使用onload
作为例子,但其他选项可用于onload
):
var oldOnload1=window.onload; window.onload=function(){ oldOnload1 && oldOnload1(); func1(); } ... var oldOnload2=window.onload; window.onload=function(){ oldOnload2 && oldOnload2(); func2(); }
或者,为了避免污染全局命名空间(可能遇到命名空间冲突),使用导入/导出IIFE模式:
window.onload=(function(oldLoad){ return function(){ oldLoad && oldLoad(); func1(); } })(window.onload) ... window.onload=(function(oldLoad){ return function(){ oldLoad && oldLoad(); func2(); } })(window.onload)
你可以使用attachEvent(ie8)和addEventListener来代替
addEvent(window, 'load', function(){ some_methods_1() }); addEvent(window, 'load', function(){ some_methods_2() }); function addEvent(element, eventName, fn) { if (element.addEventListener) element.addEventListener(eventName, fn, false); else if (element.attachEvent) element.attachEvent('on' + eventName, fn); }
基本上有两种方法
-
存储
window.onload
的前一个值,以便您的代码可以在代码执行之前或之后调用之前的处理程序 -
使用
addEventListener
方法(当然微软不喜欢,并要求您使用另一个不同的名称)。
如果另一个脚本想要使用window.onload
并且不考虑合作,那么第二种方法会给你更多的安全性,但是对于Javascript的主要假设是所有脚本都将像你正在做的那样进行合作。
请注意,一个不适合与其他未知脚本一起工作的坏脚本将总是能够打破一个页面,例如通过混乱原型,污染全局命名空间或破坏dom。
这可能不是一个stream行的select,但有时脚本最终分布在各种块,在这种情况下,我发现这是一个快速修复
if(window.onload != null){var f1 = window.onload;} window.onload=function(){ //do something if(f1!=null){f1();} }
然后在其他地方…
if(window.onload != null){var f2 = window.onload;} window.onload=function(){ //do something else if(f2!=null){f2();} }
这将根据需要更新onload函数和链