javascript - 表单提交问题之前的 Jquery ajax 验证

Question

我正在尝试使用 ajax 验证验证码，即使正在提交返回值 false 表单，我的错在哪里？

<form id="myid" name="formname" method="post" action="action.php"  onsubmit="return validate();">

JS

function validate()
{
if(document.getElementById('cap').value==''){
    alert("Please enter verification number shown in below image");
    document.getElementById('cap').focus();
    return false;
}  

var capval=document.getElementById('cap').value;

capcheck(capval).success(function (data) {
    //alert(data); not getting alert message
  if(data == "fail"){return false;} 
});
// return false; (if I use this, above alert works gives outputs either ok or fail
}
////
function capcheck(capvalue){
    return $.ajax({
        url: 'check_cap.php',
        type: 'GET',
        cache: false,
        data: {
           capid:capvalue
        }
    });
}

Answer 1

问题是检查是异步的。您可以取消表单提交，稍后在验证请求返回时提交。

尝试这样的事情

在 html 中

onsubmit="return validate(this);"

在 js 中

function validate(form)
{
    if(document.getElementById('cap').value==''){
        alert("Please enter verification number shown in below image");
        document.getElementById('cap').focus();
        return false;
    }  

    var capval=document.getElementById('cap').value;

    capcheck(capval).success(function (data) {
      if(data != "fail") {
        form.submit(); // HERE IS THE ASYNC SUBMIT
      }
      else alert('form error: '+ data);
    });
    return false; // ALWAYS PREVENT SUBMIT ON CLICK OR ENTER
}