2012-04-12 35 views
5

我試圖加載在身體的onload 2 JavaScript事件/功能如下: -身體的onload加載JavaScript與2個功能

<body onLoad="getSubs(document.form1.HotelID.options[document.form1.HotelID.selectedIndex].value);getTags(document.form1.HotelID.options[document.form1.HotelID.selectedIndex].value);"> 

每當我加載使用2種功能的第一個中止 - 但如果我只是加載一個它工作正常 - 我做錯了什麼是不可能在onload中放2個函數?

+1

你應該真的避免內聯處理程序。他們使你的代碼無法維繫。無論如何,顯然你沒有語法錯誤 – fcalderan 2012-04-12 11:25:42

+1

另請參見:[爲什麼內聯CSS和JavaScript代碼是如此糟糕](http://robertnyman.com/2008/11/20/why-inline-css-and-javascript-code -is-這樣-A-壞事情/)。另外,作爲'document'屬性直接訪問表單是非標準的。將它們作爲document.forms的屬性和元素作爲表單元素屬性的屬性(例如'document.forms.form1.elements.HotelId')或直接由ID(例如'document.getElementById('HotelID' )',假設名爲'HotelID'的輸入也被賦予相同的ID)。 – outis 2012-04-12 11:27:15

+0

不確定它是否有任何區別,但這兩個函數執行AJAX請求。 – 2012-04-12 11:42:45

回答

0

你可以做的一件事是創建一個新的JS函數,它接受document.form1.HotelID.options [document.form1.HotelID.selectedIndex] .value參數並在新創建的函數中調用這兩個函數。

我試着用下面的代碼調用兩個函數,它對我來說工作得很好。

<html> 
    <body onload="callStart();callAgain();"> 
     <script type="text/javascript"> 
      function callStart() { 
       alert('First'); 
      } 
      function callAgain() { 
       alert('Again'); 
      } 
     </script> 
    </body> 
</html> 
+0

這真的是你做的醜陋的東西這裏。見http://stackoverflow.com/questions/4478795/what-is-unobtrusive-javascript-in-layman-terms – 2014-09-30 07:56:53

7

只要做到這一點從Java腳本,而不是,共享到評論的鏈接的一個很好地解釋了爲什麼它是最好用這個辦法了內嵌屬性。

<head> 
<script> 
document.body.onload = function() { 
getSubs(...); 
getTags(...); 
}; 
</script> 
</head> 
<body> 
... 
</body> 
8

試試這個:

<html> 
<head> 
<script language="javascript"> 
function func1(){ 
    //the code for your first onload here 
    alert("func1"); 
} 
function func2(){ 
    //the code for your second onload here 
    alert("func2"); 
} 
function func3(){ 
    //the code for your third onload here 
    alert("func3"); 
} 
function start(){ 
    func1(); 
    func2(); 
    func3(); 
} 
</script> 
</head> 
<body onload="start()"> 
</body> 
</html> 

Multiple onload

1

我會不惜一切代價避免有inline javascript,那是你在你的問題的代碼做了什麼:內添加JavaScript HTML屬性。


最佳做法是增加你的JavaScript在一個單獨的文件,請參閱本原則What is Unobtrusive Javascript in layman terms?

相關的問題,所以你得叫比如「myjsfile.js」的其他文件,然後你從你的HTML頁面

<script src="./path/to/your/myjsfile.js"></script> 

這裏引用它的答案是在何處放置此引用:Where to place Javascript in a HTML file?

你「 myjsfile.js」文件只會有:

window.onload = function(){ 
    getSubs(...); 
    getTags(...); 
}; 

另一件事情,以避免:同一個HTML文件中添加JavaScript。原因也是基於相同的原理unobstrusive javascriptWhat is Unobtrusive Javascript in layman terms?

但我想有一些角落的情況下,你可能想這樣做。

如果你真的要,不要使用window.onload,而不是內聯JavaScript onload="...",明白爲什麼這裏window.onload vs <body onload=""/>

就以下內容添加到您的HTML文件:

<script type="text/javascript"> 
    window.onload = function(){ 
     getSubs(...); 
     getTags(...); 
    }; 
</script> 

下面是答案的地方放置此代碼:Where to place Javascript in a HTML file?

注:是的,在相同的地方,你會把外部JavaScript文件的引用


另一件事:我不知道getSubs()getTags()函數是在哪裏定義的。但是如果你想讓你的代碼工作,那麼在定義它們的文件(或者部分javascript)已經被加載之後,它需要調用這些函數。

總之:確保包含getSubs()getTags()定義的JavaScript文件之前你的代碼中引用