提交特定按钮的jQuery [重复]

Question

基本上我的问题非常类似于：

Click a specific submit button with JQuery

但是，我不想在按钮的 click 上触发我的事件，我想在表单的 submit 上触发事件 - 但仅限于一个特定的按钮（因为我有多个提交按钮）。

如何做到这一点？

基本上我有这个：

$("#btnCompleteOrder").click(function(event) {
    //Do stuff here
}

而且它工作正常 - 但是我希望该事件在表单验证之后触发 - 所以 submit （在 click 上发生在表单验证之前）。但是我不认为我可以在按钮上执行.submit()。

---

编辑：是的，这也类似于How can I get the button that caused the submit from the form submit event?

但是这些选项都不适合我，我一直在寻找更优雅的解决方案来解决问题。

Answer 1

我想我现在明白了这个问题。看看这是否适合你。

如果您没有提交按钮，请向您的表单添加一个提交按钮，这是发生 HTML5 验证所必需的。

<input id="invisibleSubmit" type="submit" class="submit" style="display:none">

然后为您的按钮处理程序使用：

$('#btnCompleteOrder').click(function(e) {
    //don't submit the form
    e.preventDefault();
    //click the submit button so the html5 validtion occurrs
    $("#invisibleSubmit").click();
    //do some other stuff

    //really submit the form
    $(this).unbind('submit').submit()
});

Answer 2

您可以使用submit 方法将处理程序绑定到表单的提交事件。

例如：

$('form').submit(function () {
  // Do stuff here.
});

将form 替换为与表单元素匹配的选择器。

您可能知道，这种方法比简单地监听click 要好，因为可以通过更多方式提交表单，而不仅仅是单击鼠标。也可以通过在文本字段中按回车键或通过跳到提交按钮并按空格键来提交表单。因此，您希望将事件处理程序绑定到表单本身，而不是像提交按钮这样的任何 UI 元素。