jquery - jQuery Ajax 表单仅在单击两次后提交

Question

我有一个表单，在提交时检查帐号是否有效（通过 AJAX）。

如果无效，则显示错误消息。这工作正常。

如果有效，则应提交表格。它提交，但只有在单击提交按钮两次之后。

$('#account_validation_form').on('submit', function(e){

    e.preventDefault();

    var payers_account = $("input[name='payers_account']").val();

  $.post('ajax.php', {payers_account:payers_account}, function(data){

  if(data === 'invalid'){
     $(".account_invalid_message").html("<p>Given Account Number is invalid</p>");
  }

  else if(data === 'valid'){
     $("#account_validation_form").unbind('submit').submit()
  }

  });

});

我知道打电话给e.preventDefault()那里有问题。但它是必需的，不能放在 AJAX 回调中。那么解决方案是什么？

Answer 1

尝试绑定表单帖子以提交按钮点击事件：即：

$('#submit_button_id').on('click', function(e){



    var payers_account = $("input[name='payers_account']").val();

  $.post('ajax.php', {payment_amount:payment_amount, payers_account:payers_account,}, function(data){

  if(data === 'invalid'){
     $(".account_invalid_message").html("<p>Given Account Number is invalid</p>");
  }

  else if(data === 'valid'){
     $("#account_validation_form").submit();
  }

  });

}); 

Answer 2

$('#submit_button_id').on('click', function(e)
{
    var payers_account = $("input[name='payers_account']").val();
    $.post('ajax.php',
    {
        payment_amount: payment_amount,
        payers_account: payers_account,
    }, function(data)
    {
        if (data === 'invalid')
        {
            $(".account_invalid_message").html("<p>Given Account Number is invalid</p>");
        }
        else if (data === 'valid')
        {
            $("#account_validation_form").submit();
        }
    });
});

使用此代码并对 HTML 进行一些更改，将提交按钮的 type="submit" 更改为 type="button"