在提交表格之前檢查ajax中的錯誤

Question

$(document).ready(function(){ 
    $("#userid").blur(function(){ 
     $.post("validation.php?input=userid",{ userid:$("#userid").val() } ,function(data){ 
      if(data == "blank"){ 
       $("#useridError").removeClass().addClass('messageError').html('Please do not leave blank!'); 
      } 
     }); 

    }); 
}); 

你好傢伙，我有這個代碼使用jQuery來驗證用戶標識。會有一些更多的驗證，例如密碼，名字等，但我很困惑。現在我可以告訴用戶插入的用戶標識包含錯誤。當發佈表單時，我如何檢查錯誤？

例如，用戶名和名稱會出錯，所以當我們點擊提交時，表單不會提交。如果沒有顯示錯誤，則可以提交表單。

在此先感謝！

Answer 1

<script type="text/javascript"> 
/*$(document).ready(function(){ 
    $("#userid").blur(function(){ 
     $.post("validation.php?input=userid",{ userid:$("#userid").val() } ,function(data){ 
      if(data == "blank"){ 
       $("#useridError").removeClass().addClass('messageError').html('Please do not leave blank!'); 
       return false; 
      } 
     }); 

    }); 
    $("#useremail").blur(function(){ 
     $.post("validation.php?input=useremail",{ useremail:$("#useremail").val() } ,function(data){ 
      if(data == "blank"){ 
       $("#useremailError").removeClass().addClass('messageError').html('Please do not leave blank!'); 
       return false; 
      } 
     }); 

    }); 
    $("#username").blur(function(){ 
     $.post("validation.php?input=username",{ username:$("#username").val() } ,function(data){ 
      if(data == "blank"){ 
       $("#useremailError").removeClass().addClass('messageError').html('Please do not leave blank!'); 
       return false; 
      } 
     }); 

    }); 
});*/ 

function validate_userid(){ 
    $.post("validation.php?input=userid",{ userid:$("#userid").val() } ,function(data){ 
      if(data == "blank"){ 
       $("#useridError").removeClass().addClass('messageError').html('Please do not leave blank!'); 
       return false; 
      } 
     }); 
} 
function validate_useremail(){ 
    $.post("validation.php?input=useremail",{ useremail:$("#useremail").val() } ,function(data){ 
      if(data == "blank"){ 
       $("#useremailError").removeClass().addClass('messageError').html('Please do not leave blank!'); 
       return false; 
      } 
     }); 
} 

function validate_username(){ 
    $.post("validation.php?input=username",{ username:$("#username").val() } ,function(data){ 
      if(data == "blank"){ 
       $("#useremailError").removeClass().addClass('messageError').html('Please do not leave blank!'); 
       return false; 
      } 
     }); 
} 
function validate(){ 
var userid = $("#userid").val(); 
var useremail = $("#useremail").val(); 
var username = $("#username").val(); 
if(userid == ""){ 
    validate_userid(); 
}else if(useremail == ""){ 
    validate_useremail(); 
}else if(username == ""){ 
    validate_username(); 
} 
} 

/*You can use any one of the validate()--------------the two are working as same-------------------*/ 
function validate(){ 
    var userid = $("#userid").val(); 
    var useremail = $("#useremail").val(); 
    var username = $("#username").val(); 
    if(userid == ""){ 
     $.post("validation.php?input=userid",{ userid:$("#userid").val() } ,function(data){ 
      if(data == "blank"){ 
       $("#useridError").removeClass().addClass('messageError').html('Please do not leave blank!'); 
       return false; 
      } 
     }); 
    }else if(useremail == ""){ 
     $.post("validation.php?input=useremail",{ useremail:$("#useremail").val() } ,function(data){ 
      if(data == "blank"){ 
       $("#useremailError").removeClass().addClass('messageError').html('Please do not leave blank!'); 
       return false; 
      } 
     }); 
    }else if(username == ""){ 
     $.post("validation.php?input=username",{ username:$("#username").val() } ,function(data){ 
      if(data == "blank"){ 
       $("#useremailError").removeClass().addClass('messageError').html('Please do not leave blank!'); 
       return false; 
      } 
     }); 
    } 
} 

</script> 
<form action="" method="post"> 
<input type="text" name="userid" id="userid" value="" onblur="return validate_userid();" /> 
<div id="useridError"></div> 

<input type="text" name="useremail" id="useremail" value="" onblur="return validate_useremail();" /> 
<div id="useremailError"></div> 

<input type="text" name="username" id="username" value="" onblur="return validate_username();" /> 
<div id="usernameError"></div> 

    <input type="submit" value="SUBMIT" name="submit" id="submit" onclick="return validate();" /> 
</form> 

Answer 2

您可以檢查使用Regex值如下

SCRIPT

var ck_name = 'YourDesiredRegExForValidation';//set your desired Regex to validate your `name` 

function validate(form){ 
    var name = form.name.value; 
    //set your all field's value in a variable 
    var errors = []; 

if (!ck_name.test(name)) { 
    errors[errors.length] = "You valid Name ."; 
} 
//simultaneously check out all fields 

if (errors.length > 0) { 
     reportErrors(errors); 
     return false; 
} 
    return true; 
} 

// Following function is just to display Errors 
function reportErrors(errors){ 
     var msg = "Please Enter Valide Data...\n"; 
     for (var i = 0; i<errors.length; i++) { 
       var numError = i + 1; 
       msg += "\n" + numError + ". " + errors[i]; 
     } 
     alert(msg); 
} 

退房this

Answer 3

   簡而言之，如果數據沒有通過驗證，讓函數返回false;返回false將阻止表單將數據發佈到服務器;如果數據通過驗證，則讓該函數返回true。
   我可以進一步解釋，但基本上，這就是需要發生的事情。

   希望這會有所幫助。