如何从外部文件中运行函数作为表单的操作？

Question

描述：

目前我有一个html文件，其格式如下：

<form id="my_form" action="javascript:OnAction()" method='post' >
</form>

我在script.js这样的外部文件中有javascript函数“OnAction（）”。

问题：

OnAction（）函数不运行，如果它位于外部文件中（在html中运行此函数）。 运行外部文件中的其他脚本（这意味着脚本文件已正确连接）。

题：

如何在我的表单的操作上运行OnAction（）函数并将其保存在外部文件中？

存在绑定类似的方式：

$('#my_form').on('action', function() {
    // OnAction here
});

Answer 1

将您的HTML更改为：

<form id="my_form" action="" onSubmit="OnAction()" method='post'></form>

你只需要这样做：

function OnAction() {
    // OnAction here
};

或者更好的方法是使用Jquery放置您的事件：

HTML：

<form id="my_form" action="" method='post'></form>

JS：

$("#my_form").on("submit", function() {
    /* OnAction here*/
});

Answer 2

$('#my_form').on('action', function() {

提交表单时触发的事件是submit而不是action 。 使用它（如果JS失败，在操作中使用实际URL和服务器端回退;不要忘记preventDefault() ）。

Answer 3

将外部文件的引用添加到HTML文件中。

Answer 4

在您的HTML中：

...
<form method="post" id="myform">
<input type="submit"/>
</form>

<script src="abc.js" type="text/javascript">

</script>
</body>

在你的js。 文件：

var elem = document.getElementById("myform");
elem.addEventListener("submit", function() {
   //
},false);