Question

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

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

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

这是我的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;
});

Answer 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.
});

Answer 2

由于提交按钮触发整页请求，因此没有任何事件可以触发重置，因此您无法做很多事情。如果您将表单作为ajax请求提交，则可以在超时后中止请求。

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

2 个答案: