jquery - 为什么不通过表单元素上的 Submit 方法提交表单调用 $.submit 处理程序？

Question

参见http://jsfiddle.net/8KNc7/5/有关我正在讨论的内容的工作示例(目前在 Firefox 15 中进行测试，尚未尝试其他版本)。

我有一个带有 submit 输入和 button 输入的表单，它们都将表单数据提交到服务器，但只有 submit输入导致 jQuery 提交事件运行。这是为什么？

表格:

<form action='/echo/html/' method='post' id='Form' name='Form'>
    <input type='hidden' value='posted' id='html' name='html'>
    <input type='submit' id='submit1' value='submit type'>
    <input type='button' id='submit2' value='button type' onclick='submitForm();'>
</form>

Javascript(在 body 标记末尾运行):

var theForm = document.forms['Form'];
if (!theForm) {
    theForm = document.Form;
}
function submitForm() {
    theForm.submit();
}

$(function () {
    $('form').submit(function () {
        alert('ok');
    });
});

重点是，我希望两个按钮都会引起警报，但只有一个按钮会引起警报。我知道我可以提交更改 submitForm 函数以使其正常工作，但我试图找出其中一个有效而另一个无效的区别。

Answer 1

native 表单提交方法绕过 jQuery 提交处理程序。您可以在多种情况下利用这一点。

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

    // validation
    if (valid(this)) {
        this.submit(); // submit form, bypassing jQuery bound submit handler
    }

});