在ajax回调之后提交表单答案

【问题标题】：Form submit after on ajax callback在ajax回调之后提交表单
【发布时间】：2014-05-06 04:10:42
【问题描述】：

我正在尝试在提交表单之前对网站进行 ajax 调用。如果请求成功，我希望表单能够正常提交。

$form = $('form');

$form.submit(function() {
    $.ajax({
        url: 'http://example.com',
        data: {
            name: 'test',
            email: 'test@test.com'
        },
        async: false,
        dataType: 'jsonp',
        success: function () {
            $form.unbind('submit').submit();
        },
        error: function () {
            $form.unbind('submit').submit();
        }

    });
    return false;
});

这是一个 jsfiddle - http://jsfiddle.net/5ykU5/

我希望它将请求发送到 example.com。成功和错误回调将表单与事件解除绑定并尝试提交它。

使用这种方法会导致 Jquery 抛出“Uncaught TypeError: object is not a function”。

感谢您的帮助！

【问题讨论】：

无需解绑。你有什么名字=“提交”吗？然后重命名
由于您使用的是同步调用，您可以通过标志变量来实现。查看更新的小提琴：jsfiddle.net/5ykU5/2

标签： jquery ajax

【解决方案1】：

我~~99%~~ 100% 确定您的提交按钮有

name="submit"

请重命名它以允许调用 .submit()。

无需取消绑定，现在称为 .off

success: function () {
  $form.submit(); // or $form.off("submit").submit() if you insist
},

另外你不应该使用 async:false - 我猜你是在绝望中添加的？

【讨论】：

你有一个小错字，但那是我的问题。如此愚蠢的事情花了我这么长时间来调试。谢谢！
我在手机上打字:)

【解决方案2】：

由于你使用的是同步调用，你可以通过一个标志变量来实现：

$form = $('form');

$form.submit(function() {
    var flag=true;
    $.ajax({
        url: 'http://example.com',
        data: {
            name: 'test',
            email: 'test@test.com'
        },
        async: false,
        dataType: 'jsonp',
        success: function () {
            flag=true;
        },
        error: function () {
            flag=false;
        }

    });

    return flag;

});

【讨论】：

不要使用async: false