最新消息:本站所有跳转向bbs.ykit.cn的附件将全面停止,附件已转移到https://www.qingsj.com

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

JavaScript 有客 533浏览
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:

[html]  view plain copy
<!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>    

转载请注明:有客帮 » 一个页面中执行两个window.onload函数