js window.onload 加载多个函数的两种方法
网站设计中window.onload,方法在项目中经常被使用,用法如下: - function fun(){
- alert("window的Onload事件被触发啦!");return;
- }
- window.onload=fun;
复制代码或者如下: - window.onload=function(){alert("window的Onload事件被触发啦!");return;}
复制代码1.问题: 但window.onload 不能同时加载多个函数。比如: - function fun1(){
- alert("fun1")
- }
- function fun2(){
- alert("fun2")
- }
- window.onload =fun1 ;
- window.onload =fun2 ;
复制代码后面会把前面的覆盖,上面代码只会输出 fun2。
2.解决方法 方法一: 写一个总的函数调用需要触发的函数 - window.onload =function() { fun1(); fun2(); }
复制代码 方法二:写一个方法 使用addLoadEvent(func) 使用如下: - function fun1(){
- alert("fun1")
- }
- function fun2(){
- alert("fun2")
- }
- function fun3(){
- alert("fun3")
- }
- function addLoadEvent(func) {
- var oldonload = window.onload;
- if (typeof window.onload != 'function') {
- window.onload = func;
- } else {
- window.onload = function() {
- oldonload();
- func();
- }
- }
- }
- addLoadEvent(fun1);
- addLoadEvent(fun2);
- addLoadEvent(fun3);
- //等价于 window.onload =function() { fun1(); fun2(); fun3() ;}
复制代码 |