使用 2 个函数在主体 onload 中加载 javascript
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10122555/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Loading javascript in body onload with 2 functions
提问by Paul Clubs
I am trying to load 2 javascript events/functions in the body onload as follows :-
我正在尝试在主体 onload 中加载 2 个 javascript 事件/函数，如下所示：-
<body onLoad="getSubs(document.form1.HotelID.options[document.form1.HotelID.selectedIndex].value);getTags(document.form1.HotelID.options[document.form1.HotelID.selectedIndex].value);">
Whenever I load using 2 functions the first one aborts - but if I just load the one it works fine - am I doing something wrong is it no possible to put 2 functions within the onload?
每当我使用 2 个函数加载时，第一个函数就会中止 - 但如果我只加载一个它工作正常 - 我做错了什么是不可能在 onload 中放置 2 个函数吗？
回答by Ashwini Verma
try this:
尝试这个：
<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>
回答by GillesC
Just do it from java script instead, one of the link shared into a comment explains well why it is best to use this approach over inline attributes.
只需从 java 脚本执行此操作，共享到评论中的链接之一很好地解释了为什么最好对内联属性使用这种方法。
<head>
<script>
document.body.onload = function() {
getSubs(...);
getTags(...);
};
</script>
</head>
<body>
...
</body>
回答by Adrien Be
I would avoid at all cost to have inline javascript, that is what you did in the code of your question: add javascript within an HTML attribute.
我会不惜一切代价避免拥有inline javascript，这就是您在问题代码中所做的：在 HTML 属性中添加 javascript。
Best practice is to add your javascript in a separate file, see the related question on this principle What is Unobtrusive Javascript in layman terms?
最佳做法是将您的 javascript 添加到单独的文件中，请参阅有关此原则的相关问题What is Unobtrusive Javascript in unobtrusive Javascript？
So you'd have an other file called for instance "myjsfile.js", then you reference it from your HTML page
所以你有一个名为“myjsfile.js”的其他文件，然后你从你的 HTML 页面引用它
<script src="./path/to/your/myjsfile.js"></script>
Here is the answer to where to place this reference: Where to place Javascript in a HTML file?
以下是此引用放置位置的答案：将 Javascript 放置在 HTML 文件中的何处？
Your "myjsfile.js" file would simply have:
您的“myjsfile.js”文件将仅具有：
window.onload = function(){
getSubs(...);
getTags(...);
};
Another thing to avoid: add javascript within the same HTML file. The reason is also based on the same principle of unobstrusive javascript. What is Unobtrusive Javascript in layman terms?
另一件要避免的事情：在同一个 HTML 文件中添加 javascript。原因也是基于相同的原理unobstrusive javascript。用外行人的话说，什么是 Unobtrusive Javascript？
But I guess there are corner cases where you may want to do that.
但我想在某些极端情况下您可能想要这样做。
If you really have to, do use window.onloadinstead of the inline javascript onload="...", see why here window.onload vs <body onload=""/>
如果你真的有必要，不要使用window.onload内联 javascript onload="..."，看看为什么window.onload vs <body onload=""/>
Just add the following to your HTML file:
只需将以下内容添加到您的 HTML 文件中：
<script type="text/javascript">
window.onload = function(){
getSubs(...);
getTags(...);
};
</script>
Here is the answer to where to place this code: Where to place Javascript in a HTML file?
以下是放置此代码的位置的答案：将 Javascript 放置在 HTML 文件中的何处？
Note: Yes, in the same place as where you would put the reference to an external javascript file
注意：是的，与您将引用外部 javascript 文件的位置相同
Another thing: I do not know where your getSubs()and getTags()functions are defined. But if you want your code to work, it needs to call these functions after the file (or part of javascript) that defines them has been loaded.
另一件事：我不知道你的getSubs()和getTags()函数在哪里定义。但是如果你想让你的代码工作，它需要在定义它们的文件（或 JavaScript 的一部分）被加载后调用这些函数。
In short: make sure the javascript file containing the definitions of getSubs()and getTags()is referenced beforeyour code.
总之：确保包含的定义JavaScript文件getSubs()和getTags()被引用之前，你的代码。
回答by Krishna
One thing that you could do is create a new JS function that accepts the document.form1.HotelID.options[document.form1.HotelID.selectedIndex].value parameter and call the two functions in the newly created function.
您可以做的一件事是创建一个新的 JS 函数，该函数接受 document.form1.HotelID.options[document.form1.HotelID.selectedIndex].value 参数并在新创建的函数中调用这两个函数。
I tried calling two functions using the below code and it worked fine for me.
我尝试使用以下代码调用两个函数，对我来说效果很好。
<html>
<body onload="callStart();callAgain();">
<script type="text/javascript">
function callStart() {
alert('First');
}
function callAgain() {
alert('Again');
}
</script>
</body>
</html>
