14

我正在尝试在正文 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);">

每当我使用 2 个函数加载时，第一个函数会中止 - 但如果我只加载一个它工作正常 - 我做错了什么，是否不可能将 2 个函数放入 onload 中？

4

4 回答 4

20

尝试这个：

<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>

多重加载

于 2012-04-12T11:37:41.417 回答
8

只需从 java 脚本中执行此操作，共享到评论中的链接之一很好地解释了为什么最好使用这种方法而不是内联属性。

<head>
<script>
document.body.onload = function() {
getSubs(...);
getTags(...);
};
</script>
</head>
<body>
...
</body>
于 2012-04-12T11:33:39.947 回答
2

我会不惜一切代价避免拥有inline javascript，这就是您在问题代码中所做的：在 HTML 属性中添加 javascript。

最佳做法是将您的 javascript 添加到一个单独的文件中，请参阅有关此原则的相关问题What is Unobtrusive Javascript in layman terms？

因此，您将有一个名为“myjsfile.js”的其他文件，然后您从 HTML 页面中引用它

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

以下是放置此参考的答案：在 HTML 文件中放置 Javascript 的位置？

您的“myjsfile.js”文件将简单地具有：

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

另一件要避免的事情：在同一个 HTML 文件中添加 javascript。原因也是基于同样的原理unobstrusive javascript。外行术语中的 Unobtrusive Javascript 是什么？

但我想在某些极端情况下你可能想要这样做。

如果你真的需要，不要使用window.onloadinline javascript onload="..."，看看为什么在这里window.onload vs <body onload=""/>

只需将以下内容添加到您的 HTML 文件中：

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

以下是放置此代码的位置的答案：在 HTML 文件中放置 Javascript 的位置？

注意：是的，与您将引用放置到外部 javascript 文件的位置相同

另一件事：我不知道你的getSubs()和getTags()功能是在哪里定义的。但是如果你想让你的代码工作，它需要在定义它们的文件（或javascript的一部分）被加载之后调用这些函数。

简而言之：确保包含 和 定义的 javascript 文件getSubs()在您的代码之前getTags()被引用。

于 2014-09-30T08:18:02.763 回答
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>
于 2012-04-12T11:33:10.990 回答