jQuery submit() 和 AJAX 事件；如何触发常规表单提交？答案

【问题标题】：jQuery submit() and AJAX event; How can I trigger a regular form submit?jQuery submit() 和 AJAX 事件；如何触发常规表单提交？
【发布时间】：2012-02-24 19:56:45
【问题描述】：

我正在开发一个项目，当单击提交按钮时，我会捕获事件并通过外部服务运行表单以检查某些内容是否有效。

如果出现问题，我会弹出一个对话框，告诉用户出现问题，并让他们选择覆盖以继续。

问题是如何触发表单提交。如果我只使用 .submit()，它会再次将表单发送到对话框中。

$('#editAddr').submit(function(){
    var checkString = addrString();
    $.getJSON('/validate.php' + checkString, function(data){
        if(data == 0){
            var confw = '';
            confw += '<div><p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>';
            confw += 'Failed validation.</p></div>';

            var $dialog = $(confw).dialog({
                title: "Validation Problem",
                modal: true, resizable: false, width: 500,
                buttons: {
                    "Edit": function(){
                        $(this).dialog('close');
                    },
                    "Override": function(){
                        $(this).dialog('close');
                        $('#editAddr').submit();
                    }
                }
            });
        }else{
            $('#editAddr').submit();            
        }
    });

    return false;
});

如何通过单击对话框按钮正确提交此表单？

编辑：确保您的表单不包含带有 id="submit" 的按钮，否则您将破坏 jQuery .submit()

【问题讨论】：

标签： jquery forms form-submit

【解决方案1】：

不要绑定到表单的提交事件，而是绑定到提交按钮的点击事件。这样你就可以捕捉到提交事件的点击事件，并在需要的时候返回 false，或者继续表单上的 submit() 事件。

$('input[type="submit"]').click(function(e){
    e.preventDefault();
    if() // invalid data
    {

    }
    else // good to go
    {
        $('form').submit();
    }
})

如果有人禁用了 JavaScript，这个解决方案也会很好地降级。我读过的其他一些解决方案不允许这样做。

【讨论】：

请注意，您在最初的问题中从未谈到过降级
@OlivierRefalo - 你骂我积极主动？

【解决方案2】：

只需在表单的 dom 元素上调用 .submit()。

我认为你可以像这样从 jQuery 获得它：

$('#editAddr')[0].submit();  // goes in your Override button logic

【讨论】：

【解决方案3】：

问题来自于您连接逻辑的方式。

表单中的按钮应设为常规按钮，而不是提交按钮
那么，它的 onaction 属性应该指向上面的方法。

之后 form.submit() 应该会按预期工作。

另一种选择是在方法上添加一个标志。

【讨论】：

如果有人禁用了 JavaScript，没有提交按钮会导致表单无用。
同范围的经验思想：如果有人关闭互联网，浏览器将无用。如果有人关闭了cookies，浏览器就没有用了。

【解决方案4】：

您的问题是在 Jquery 对象上调用 submit 再次通过 jquery onsubmit 运行它。一旦你完成了验证器，你只需要在 DOM 对象上调用它——你可以用

document.GetElementById(editAddr).submit();

或与

$("#editAddr").get(0).submit();

至少，这是它与验证提交处理程序一起工作的方式。我认为它与标准提交处理程序的工作方式相同。

【讨论】：

这听起来像是固有的表单提交数据没有正确设置。尝试注释掉 jquery 提交功能并查看提交按钮是否单独工作。如果没有覆盖和检查逻辑就无法正常工作，那么您将永远无法使用它。
错误：对象# 的属性“提交”不是函数。由具有 id 提交的按钮引起。 royaltutorials.com/property-submit-of-object-is-not-a-function

【解决方案5】：

添加类似 isOverride 或 isValid 布尔值，您可以在提交函数的开头检查它们以绕过进一步处理。

【讨论】：