javascript - window.onload被覆蓋,怎么解決?
問題描述
window.onload = function(){ var para =document.createElement('p'); var info = 'NodeName:'; info += para.nodeName; info += ' NodeType:'; info += para.nodeType; alert(info); } window.onload = function(){ var para = document.getElementById('testid'); var e = document.createElement('p'); var txt = document.createTextNode('hello zmz'); para.appendChild(e); e.appendChild(txt); }
只執(zhí)行了第二個window.onload,但是我想讓兩個window.onload都執(zhí)行。該怎么處理?
問題解答
回答1:我們都知道onload事件只能執(zhí)行一次,所以假設(shè)你要運行兩個onload時候執(zhí)行的函數(shù),最后只能執(zhí)行后一個onload事件的函數(shù),那么我們?nèi)绾螆?zhí)行多個onload事件的函數(shù)呢,形式如下:
window.onload = function(){num1();num2();}
所以,我們就頂一個函數(shù)addLoadEvent(func),它只接受參數(shù),就是在頁面加載完畢時執(zhí)行的函數(shù)的名字
function addLoadEvent(func){ var oldonload = window.onload; //把現(xiàn)在有window.onload事件處理函數(shù)的值存入變量oldonload。 if(typeof window.onload != ’function’){ //如果這個處理函數(shù)還沒有綁定任何函數(shù),就像平時那樣把新函數(shù)添加給它 window.onload = func; }else{ //如果在這個處理函數(shù)上已經(jīng)綁定了一些函數(shù)。就把新函數(shù)追加到現(xiàn)有指令的末尾 window.onload = function(){ oldonload(); func(); } } }
調(diào)用:
addLoadEvent(num1);addLoadEvent(num2);回答2:
window.addEventListener(’load’,function(e){state1},false);window.addEventListener(’load’,function(e){state2},false);不建議用onload
回答3:建議 一個頁面就一個window.onload
window.onload = function(){ var para =document.createElement('p'); var info = 'NodeName:'; info += para.nodeName; info += ' NodeType:'; info += para.nodeType; alert(info); var para = document.getElementById('testid'); var e = document.createElement('p'); var txt = document.createTextNode('hello zmz'); para.appendChild(e); e.appendChild(txt); }
如果怕命名沖突,可用封閉空間
window.onload = function(){ (function(){var para =document.createElement('p'); var info = 'NodeName:'; info += para.nodeName; info += ' NodeType:'; info += para.nodeType; alert(info); })();(function(){var para = document.getElementById('testid'); var e = document.createElement('p'); var txt = document.createTextNode('hello zmz'); para.appendChild(e); e.appendChild(txt); })();} 回答4:
方法1
function fn1(){ var para =document.createElement('p'); var info = 'NodeName:'; info += para.nodeName; info += ' NodeType:'; info += para.nodeType; alert(info); }function fn2(){ var para = document.getElementById('testid'); var e = document.createElement('p'); var txt = document.createTextNode('hello zmz'); para.appendChild(e); e.appendChild(txt); }window.onload = function(){ fn1(); fn2();}
方法2是用樓上的方法。
window.addEventListener(’load’,function(e){fn1();},false);window.addEventListener(’load’,function(e){fn2();},false);
相關(guān)文章:
1. javascript - 請問一下fullpage只能初始化一次的問題怎么解決?2. HTML5禁止img預(yù)覽該怎么解決?3. javascript - bootstrap table固定列之后寬度無法對齊怎么解決?4. javascript - ios返回不執(zhí)行js怎么解決?5. 路由 - nginx訪問不了根目錄下的文件怎么解決?6. javascript - 圖片鏈接請求一直是pending狀態(tài),導(dǎo)致頁面崩潰,怎么解決?7. java - 我用Tomcat訪問SQL server數(shù)據(jù)庫時,出現(xiàn)以下錯誤,該怎么解決?8. angular.js - Beego 與 AngularJS的模板格式?jīng)_突,該怎么解決?9. javascript - vue的這個打包錯誤怎么解決?10. 前端 - [css動畫] transition動畫之后執(zhí)行display:none,動畫不生效,怎么解決?
