关于AJAX，需要点击两次提交按钮答案

【问题标题】：About AJAX, need to click submit button two times关于AJAX，需要点击两次提交按钮
【发布时间】：2014-07-18 22:37:14
【问题描述】：

我的 ajax 代码如下所示：

 $("#form").submit(function(event){

        var $form = $(this);
        var serializedData = $form.serialize();
        var $inputs = $form.find("input, select, button, textarea");

        request = $.ajax({
            url: "/blog/ajaxphp/registration_check.php",
            type: "post",
            data: {formData:serializedData},
            datetype: "JSON"
        });
        request.done(function (response, textStatus, jqXHR){
            if(jQuery.parseJSON(response).success==undefined){
                $form.unbind('submit');
                $form.submit();
            }
        });
        request.fail(function (jqXHR, textStatus, errorThrown){
        });
        event.preventDefault();


    });

问题：我需要单击提交按钮两次，否则此表单不会被提交。我尝试使用 return false 而不是 preventdefault 并尝试使用 $form.unbind('submit'); 但不工作。

如何让提交按钮一键工作

【问题讨论】：

你能提供一个 jsfiddle 来显示发生的问题吗？
你有没有为表单运行的验证脚本？
@BrettWeber 根据问题代码没有问题吗？？
您的提交按钮是否有任何进一步的单击或键事件绑定？ submit 事件在实际表单提交之前触发，但可能在表单上的子元素上的其他单击事件之后触发。甚至可能是提交按钮上的 onclick 属性。不过，jsfiddle 可能有助于推测。
我不知道 jsfiddle 但你能通过团队 veiwer 帮助我吗？

标签： javascript jquery ajax forms

【解决方案1】：

在 request.done 事件中，如果未定义成功则返回 true。您可以考虑在未定义成功时取消绑定并重新提交表单的替代方法，或者一起删除该部分并仅显示一条消息，指出无法提交表单并应再次尝试。值得一试，看看简化流程是否会产生您想要的结果。

我也会删除 event.preventDefault();并在 request.fail 事件中返回 false。

我假设您正在执行所有这些操作，因为您不想在 ajax 调用完成之前提交表单，因此您可能想尝试将 async: false 添加到您的 $.ajax 请求中：

$("#form").submit(function(event){

    var $form = $(this);
    var serializedData = $form.serialize();
    var $inputs = $form.find("input, select, button, textarea");

    request = $.ajax({
        url: "/blog/ajaxphp/registration_check.php",
        type: "post",
        data: {formData:serializedData},
        async: false,
        datetype: "JSON"
    });
    request.done(function (response, textStatus, jqXHR){
        if(jQuery.parseJSON(response).success==undefined){
            $form.unbind('submit');
            $form.submit();
        }
        else
        {
            return true;
        }
    });
    request.fail(function (jqXHR, textStatus, errorThrown){
            return false;
    });
});

【讨论】：