页面同时ONLOAD多个函数如何解决呀?

发布网友发布时间：2022-04-25 12:54

共4个回答

懂视网时间：2022-04-25 17:15

代码如下:
/*
1、obj相当于window
2、type相当于onload
3、fn相当于匿名函数
*/
function addEvent( obj,type,fn ){
var saved = null; // 用户保存上一个事件
if( typeof obj[ "on" + type ] == "function" ){
saved = obj[ "on" + type ]; // 用户保存上一个事件
};
// 执行事件
obj[ "on" + type ] = function(){
if( saved ){
saved()
};
fn();
};
};
addEvent( window,"load",function(){
alert( "我是尜尜1" );
});
addEvent( window,"load",function(){
alert( "我是尜尜2" );
});
addEvent( window,"load",function(){
alert( "我是尜尜3" );
});

热心网友时间：2022-04-25 14:23

根据问题描述，程序有误，正确是
程序代码<html>
<body onload="function1();function2();function3();">
</body>
</html>

拓展：
1、最简单的调用方式
直接写到html的body标签里面，如下示例：
程序代码<html>
<body onload="function()">
</body>
</html>

2.在JavaScript语句里调用
程序代码<script>
function f1(){...}
window.onload=f1;
</script>

3.同时调用多个函数(body方式)
程序代码<html>
<body onload="function1();function2();function3();">
</body>
</html>

4.在JavaScript语句中同时调用多个函数
程序代码<script>
function f1(){...}
function f2(){...}
function f3(){...}
function f4(){...}
window.onload=function(){
f1();
f2();
f3();
f4();
}
</script>

这种调用方式可以用于不太复杂的JavaScript程序中，如果程序函数很多，逻辑比较复杂，可以考虑用另外一种方式。

5.自定义函数式多次调用
程序代码<script>
function f1(){...}
function f2(){...}
function f3(){...}
function f4(){...}
//onload事件侦听函数
function addLoadEvent(func){
var oldonload=window.onload;
if(typeof window.onload!="function"){window.onload=func;}else{window.onload=function(){oldonload();func();}};
}
//调用方式
addLoadEvent(f1);
addLoadEvent(f2);
addLoadEvent(f3);
addLoadEvent(f4);
</script>
这种方式调用比较方便，逻辑清晰。

但要注意的问题是，不可以同时混合运用两种调用方式，因为onload事件只有一次。

热心网友时间：2022-04-25 15:41

热心网友时间：2022-04-25 17:16

不是只能执行一个啊，在body里有个onLoad那个能调用多个。中间用“；”还是“，”分开忘了