2010-11-02 101 views
1

如何在窗口的onload事件中調用多個javascript函數?Javascript函數調用

對於防爆,

   window.onload=MyFunc(); //Single Function 

但是如果有一個以上的功能,在窗口的onload事件調用...

+1

這是不正確的,除非'MyFunc'返回一個函數對象。在「MyFunc」之後放置圓括號表示您立即調用它,而由MyFunc返回的值將被分配給「window.onload」。我想你的意思是'window.onload = MyFunc'。 – 2010-11-02 10:13:32

回答

11

總結他們。

window.onload = function() { MyFunc(); MyOtherFunc(); } 
+0

同意; – 2010-11-02 07:03:29

4

或者你可以綁定功能到窗口的Load事件:

window.addEventListener("load", MyFunction, false); 
window.addEventListener("load", MyOtherFunction, false); 

對於IE的傳統,你可能需要使用的attachEvent方法:

window.attachEvent("load", MyFunction); 
window.attachEvent("load", MyOtherFunction); 

問題這種方法是執行功能的順序不能被計算在內。

+0

這當然需要在IE <9上使用fallback'attachEvent'代碼。 – bobince 2010-11-02 07:05:43

0

爲什麼不能在頁面加載時調用一個函數內有多少個函數調用的老派方法? window.addEventListener(「load」,Foo,false);

其中Foo調用了所有必需的函數。 這樣您可以控制訂單並在需要時返回值。

1

這裏是一個樣片,將講解如何:

// create an array that will contain all 
// your functions that you would like to 
// call on page load 
var pageOnLoadEvents = []; 

// Add one or more functions in pageOnLoadEvents array 
pageOnLoadEvents.push(function() { alert("Hello!"); }) 
pageOnLoadEvents.push(function() { alert("How are you?"); }) 


// This will call when your page will load 
window.onload = function() { 
    // Loop through each index of pageOnLoadEvents 
    for(var index = 0; index < pageOnLoadEvents.length; index++) { 
    // '()' brackets in the end tell them to make a call 
    // If you don't include '()' at the end this will 
    // suspect as a object as in JavaScript functions 
    // are first-class objects. 
    // document.write(pageOnLoadEvents[index].toString()); // treat as object 
    pageOnLoadEvents[index](); 
    } 
} 

上述樣品試圖變得簡單,讓您對您的問題的解釋。然而,在Simon Willison’s Weblog一個很好的解釋,他寫道:

function addLoadEvent(func) { 
    var oldonload = window.onload; 
    if (typeof window.onload != 'function') { 
    window.onload = func; 
    } else { 
    window.onload = function() { 
     if (oldonload) { 
     oldonload(); 
     } 
     func(); 
    } 
    } 
} 

addLoadEvent(nameOfSomeFunctionToRunOnPageLoad); 
addLoadEvent(function() { 
    /* more code to run on page load */ 
}); 

的addLoadEvent函數將作爲 參數一旦頁面加載應該 執行其他功能。 與直接指定給window.onload的 不同,該函數以這樣的方式添加 事件,即任何 先前添加的onload函數將首先執行 。 Read more