jQuery - 为什么 $('form').get(0).submit() 不会触发附加的提交处理程序？答案

【问题标题】：jQuery - Why does $('form').get(0).submit() not trigger the attached submit handler?jQuery - 为什么 $('form').get(0).submit() 不会触发附加的提交处理程序？
【发布时间】：2014-10-12 03:21:30
【问题描述】：

假设我为表单创建了以下处理程序（回调）：

$('form').submit(function (event) {
   event.preventDefault();
   alert('form submitted');
});

为什么调用$('form').get(0).submit 不调用提交处理程序？表单直接被提交。

【问题讨论】：

标签： jquery forms

【解决方案1】：

.get(0) 返回本机 js DOM 元素（与 $('form')[0] 相同），然后您将触发直接提交事件。

如果您尝试获取第一个元素，请使用 .eq(0) 并使用 .submit() 触发提交 jQuery 样式。

总结：

$('selector')[0] ~ 返回原生 js DOM 元素
.get(0) ~ 同 [0]。
.eq(0) ~ 将第一个元素作为 jQuery 对象返回。

附加到提交事件（jQuery）：$('form.selector').submit(function (e) { });
触发提交 (jQuery)：$('form.selector').submit(); 或 $('form.selector').trigger('submit');
在第一个元素上触发提交：$('form').eq(0).submit();

演示：jsFiddle

我希望它是你需要的。

演示 jQuery:

$('form').submit(function (event) {
    event.preventDefault(); // Will prevent the native handler from firing.
    alert('form submitted :' + $(this).attr("id"));
});

//change the `.eq(index)` to 1 to trigger the submit on the second form:  
$('form').eq(0).submit(); // Same as: $('form').eq(0).trigger("submit");

演示 HTML：

<form id="form1"></form>
<form id="form2"></form>

【讨论】：

哇，这是新的——所以有两个提交处理程序？一个绑定到原生 DOM 元素，一个绑定到 jQuery 对象？有没有办法将回调绑定到本机 DOM 元素 AND jQuery 对象？
@bodacydo 并非如此 - 只有一个提交事件处理程序 (JS) - jQuery submit() 将在完成时触发它，除非您添加 event.preventDefault(); 这将阻止调用实际事件.
但是如你所见，调用 $('form').get(0).submit() 不会调用 jquery 的触发器...所以必须有另一个触发器只针对 DOM 元素?我错了吗？
.submit() 是一个 jQuery 方法，在原生对象中不存在（即 get(0) 返回），.submit() 可以在 jQuery 元素上调用并触发 js .submit + 你分配的处理程序。