JavaScript:当函数被称为'submit'时,表单onSubmit不起作用

时间:2014-08-09 20:26:46

标签: javascript html forms

我正在尝试在单击表单的提交按钮时调用JavaScript函数。

由于某种原因,该函数在被命名为“提交”时不会被调用,但是当它被命名为其他任何内容时,它就会起作用。

我还应该注意,当从表单标签中取出按钮时,该功能也可以使用。

任何人都可以解释一下为什么当它在表格中时它不能用这个名字吗?

以下是代码:

<!DOCTYPE HTML>
<html>
    <head>
        <script type="text/javascript"> 
            function submit(){
               console.log('test');
            }
        </script>
    </head>     
    <body>
        <form>
            <input type="text"/>
            <input type="submit" onclick="submit()"/>
        </form>
    </body>
</html>

2 个答案:

答案 0 :(得分:1)

因为submit()是在核心JS中提交表单的保留函数。

例如,如果您的表单具有myform之类的ID,则可以通过JS提交它:

document.form['myform'].submit();

因此,调用该功能实际上是在提交表单而不是调用自定义函数。

编辑:我忘了提及,它只适用于表单,因为它调用该表单的提交功能。其中它不再可用(因为正文标签没有提交功能)。

答案 1 :(得分:0)

表单元素放在表单内的侦听器范围链中,如下所示:

with (form) {
  /* run listener code */
}

所以标识符 submit 首先在处理程序的上下文中解析,然后在表单链的其余部分之前的表单上解析。这是形式所独有的,可以在下面看到:

<form>
  <input name="foo">
  <input type="button" value="Do click" onclick="
    function submit(){console.log('click')};
    submit();
  ">
</form>

单击该按钮在侦听器中运行 submit 函数,删除函数声明将运行表单的提交方法。这是形式所独有的。

请注意,当直接调用表单的submit方法时,不会调用其提交处理程序。

在表单之外,标识符 submit 以正常方式解析。