jquery - 为什么 ('#formId' ).trigger ('submit' ) 会导致我的表单多次发布，而 ('formId' ).trigger ('submit' ) 不会？

Question

我有一个分为多个选项卡的 MVC3 页面。每个选项卡上都有一个带有不同 id 的 AJAX 表单的部分 View 。

@using (Ajax.BeginForm("Create1", "ControllerName", ajaxOptions, new { id = "frmCreate1" }))
...
@using (Ajax.BeginForm("Create2", "ControllerName", ajaxOptions, new { id = "frmCreate2" }))
...
@using (Ajax.BeginForm("Create3", "ControllerName", ajaxOptions, new { id = "frmCreate3" }))

每个选项卡上都有一个具有不同 ID 的保存按钮。

<input type="submit" id="btnSave1" />
...
<input type="submit" id="btnSave2" />
...
<input type="submit" id="btnSave3" />
...

每个选项卡都包含一个 javascript 文件，其中包含按钮的处理程序:

// Submit Button
    $('#btnSave1').button({ label: "Save" });
    $('#btnSave1').click(function () {
        $.blockUI({ message: 'We are constructing your new Type 1, please wait just a moment...', theme: true, title: 'Saving' });
        $('frmCreate1').trigger('submit');
    });

...
// Submit Button
    $('#btnSave2').button({ label: "Save" });
    $('#btnSave2').click(function () {
        $.blockUI({ message: 'We are constructing your new Type 2, please wait just a moment...', theme: true, title: 'Saving' });
        $('frmCreate2').trigger('submit');
    });
...

// Submit Button
    $('#btnSave3').button({ label: "Save" });
    $('#btnSave3').click(function () {
        $.blockUI({ message: 'We are constructing your new Type 3, please wait just a moment...', theme: true, title: 'Saving' });
        $('frmCreate3').trigger('submit');
    });

一切都正确提交到后端，并且它正在从表单中获取所需的数据。但是我将方法中的选择器更改为

$('#frmCreate1).trigger('submit');  

现在，当运行它时，表单被提交多次，导致我跳入调试器并随后发布相同的数据两次。

我猜测它是通过 Ajax 使用正确的选择器提交表单，然后再次触发表单的实际提交，但我不确定发生了什么。

我想确保代码对于我真正想做的事情来说是正确的。这些应该是 3 个单独且单独的提交。我是否将“提交”按钮更改为仅按钮类型而不是提交，还是应该在 javascript 中添加更多按钮以防止发生第二次提交？预防默认值还是什么？

谢谢!

编辑:还应该包括 Ajax 选项，它们出现在每个选项卡上并对应于选项卡，它们的命名都不同，但以防万一“Post”方法与此有关。

@{
    AjaxOptions ajaxOptions = new AjaxOptions
    {
        HttpMethod = "Post",
        UpdateTargetId = "tabs-1",
    };
}

Answer 1

重新发布我在评论中的答案:

问题是提交按钮实际上正在提交表单，而选择器 $('frmCreate1').trigger('submit'); 没有执行任何操作，因为它没有返回任何元素。当通过添加“#”使选择器有效以便它查找 id 而不是标签名称时，也会触发提交。因此双重提交。如果您选择其中之一，则应停止双重提交。