一个页面中执行两个window.onload函数

最新推荐文章于 2023-10-25 17:59:27 发布

___________超

最新推荐文章于 2023-10-25 17:59:27 发布

阅读量7.2k

点赞数 2

分类专栏： JavaScript 文章标签： function xhtml javascript html 优化

本文链接：https://blog.csdn.net/van416521/article/details/6953556

版权

JavaScript 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

1.问题描述:

当一个HTML页面中加载了两个window.οnlοad=function() {};函数时,页面只会执行第二个window.onload里面的内容

如下,结果显示2:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>test</title> 
<script language="javascript"> 
window.onload = function() {
	alert('1');
};

</script> 
</head> 
<body>
	<h1>表格</h1>
	
	<script type="text/javascript">
		window.onload = function() {
			alert('2');
		};
	</script>
</body> 
</html>

2.解决方法如下,可以显示1,2:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>test</title> 
<script language="javascript"> 
window.onload = function() {
	alert('1');
};




</script> 
</head> 
<body>
	<h1>表格</h1>
	
	<script type="text/javascript">
		var saved;
		if (typeof window.onload == 'function') {
			saved = window.onload;
		}
		window.onload = function() {
			if (saved) saved();
			alert('2');
		};
	</script>
</body> 
</html>

3.优化成函数:

function addEvent(obj,evt,fn) {											
	var saved;
	if (typeof obj["on"+evt] == "function") {
		saved = obj["on"+evt];
	}
	obj["on"+evt] = function () {
		if (saved) saved();		
		fn();				
	}					
}

如下,跟2一样:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>test</title> 
<script language="javascript"> 
function addEvent(obj,evt,fn) {											
	var saved;
	if (typeof obj["on"+evt] == "function") {
		saved = obj["on"+evt];
	}
	obj["on"+evt] = function () {
		if (saved) saved();		
		fn();				
	}					
}
addEvent(window,'load',firstAll);
function firstAll() {
	alert('1');
}
</script> 
</head> 
<body>
	<h1>表格</h1>
	
	<script type="text/javascript">
		addEvent(window,'load',nextAll);
		function nextAll() {
			alert('2');
		}
	</script>
</body> 
</html>

___________超

关注

2
点赞
踩
2

收藏

觉得还不错? 一键收藏
1
评论
一个页面中执行两个window.onload函数

1.问题描述:当一个HTML页面中加载了两个window.onload=function() {};函数时,页面只会执行第二个window.onload里面的内容如下,结果显示2: test window.onload = function() { alert('1');}; 表格 window.onlo
复制链接

扫一扫