jQuery提交不使用<a>

Question

我正在尝试提交一个表单链接.为什么命名提交输入元素submit,链接不再有效？

 //breaks form submission
 <input type="submit" value="Submit" name="submit" />

 //does not break form submission
 <input type="submit" value="Submit" name="xsubmit" />

在Chrome中,我收到以下错误消息.

Uncaught TypeError: Property 'submit' of object #<HTMLFormElement> is not a function

不工作

<p>Type 'correct' to validate.</p>
  <form method="post" enctype="multipart/form-data">
    <input type="submit" value="Submit" name="submit" />

    <a id="btn_submit">
        <span id="txt_submit">Submit</span>
    </a>
  </form>

<script>

$("#btn_submit").click(function() {
     $("form").submit();
    });

    $("form").submit(function() {

    });
</script>

工作

 <p>Type 'correct' to validate.</p>
  <form method="post" enctype="multipart/form-data">
    <input type="submit" value="Submit" name="xsubmit" />

    <a id="btn_submit">
        <span id="txt_submit">Submit</span>
    </a>
  </form>

<script>

$("#btn_submit").click(function() {
     $("form").submit();
    });

    $("form").submit(function() {

    });
</script>

Answer 1

"提交"是一个保留字.它与javascript冲突.只需将输入的名称更改为其他名称即可.

从方法submit()的jQuery文档:

表单及其子元素不应使用与表单属性冲突的输入名称或ID,例如提交,长度或方法.名称冲突可能导致混乱的故障.有关规则的完整列表以及检查这些问题的标记,请参阅DOMLint.

Answer 2

两个变化:

$(function () {

$("#btn_submit").click(function(e) {
     e.preventDefault();
     $("form").submit();
    });

    $("form").submit(function() {

    });

});

首先,在document.ready处理程序中包含bind.$(function () {...}); 其次,在事件上添加preventDefault调用以停止正常的锚点功能.