如果表单提交失败，启用提交按钮答案

【问题标题】：Enable submit button if form submission failed如果表单提交失败，启用提交按钮
【发布时间】：2014-10-30 10:59:01
【问题描述】：

我有以下代码在提交表单后禁用提交按钮，以防止一次多次提交。

问题是，如果下一页永远不会加载或用户连接发生问题，按钮将保持禁用状态。

有没有办法检查用户是否仍然连接并在提交失败时再次启用按钮，以便用户可以重新尝试提交表单？

这是我的 jQuery 代码：

$form.on("submit", function() {
    var emptyInputs = 0;

    // calculate empty inputs

    if (emptyInputs === 0) {
        var $button = $("#signup button");

        $button.prop("disabled", true);

        //if (/* connection is lost / offline */) {
        //    $button.prop("disabled", false);
        //}

        return true;
    }

   return false;
});

【问题讨论】：

标签： javascript jquery forms

【解决方案1】：

试试这个，

//callback handler for form submit
$form.submit(function(e)
{        
    var postData = $(this).serializeArray();
    var formURL = $(this).attr("action");
    $.ajax(
    {
        url : formURL,
        type: "POST",
        data : postData,
        success:function(data, textStatus, jqXHR) 
        {
            //go to success page
        },
        error: function(jqXHR, textStatus, errorThrown) 
        {
            // handle fail event your way 
            $("#signup button").removeAttr("disabled");     
        }
    });
    e.preventDefault(); //STOP default action
    e.unbind(); //unbind. to stop multiple form submit.
});

【讨论】：

【解决方案2】：

由于提交按钮会触发整页请求，因此您无能为力，因为没有触发重置的事件。如果您将表单作为 ajax 请求提交，您可以在特定超时后中止请求。

【讨论】：