onsubmit校驗表單時利用ajax的return false無效解決方法

 

代碼：

function checkNewEmail(){

             var re_email=new RegExp("\\w+@\\w+\\.\\w+\\.?\\w*");
             var newEmail=$("#email_new").val();
             if(re_email.test(newEmail)){
                 $.ajax({
                     type:"post",
                     dataType:"json",
                     url:"existEmail?email="+newEmail,
                     success:function(dataResult){
                         if(dataResult=="true"){
                             $("#emial-error").text("郵箱已註冊。");
                             return false;
                         }else{
                             return true;
                         }
                     }
                 });
             }else{
                 return false;
             }
         }

每次郵箱格式正確用ajax判斷郵箱是否已存在時，不管成功否都執行submit，卡了很久，網上找了好多，終於找到緣由也解決方案了。

問題緣由

　　執行ajax時return false的function 與onsubmit()不是同一個函數，因此不管return 什麼都會直接執行submit()提交表單ok知道錯誤緣由了以後修改一下代碼

修改後代碼：

function checkNewEmail(){

            var flat=false;
            var re_email=new RegExp("\\w+@\\w+\\.\\w+\\.?\\w*");
             var newEmail=$("#email_new").val();
             if(re_email.test(newEmail)){
                 $.ajax({
                     type:"post",
                     dataType:"json",
                     url:"existEmail?email="+newEmail,
                     success:function(dataResult){
                         if(dataResult=="true"){
                             $("#emial-error").text("郵箱已註冊。");
                             flat=false;
                         }else{
                             flat=true;
                         }
                     }
                 });
             }else{
                 return false;
             }

             return flat;

         }

修改以後再執行,但是每次執行完都return false,就好像flat=true,不起做用同樣，但是調試了發現明明有執行flat=true

問題緣由

　　在執行ajax時，async默認的默認值爲true,這種狀況爲異步方式，就是說ajax發送請求後，在等待服務端返回的這個過程當中，前臺會繼續執行ajax塊後面的腳本，直到服務端返回正確的結果纔會執行success,也就是說這時執行的是兩個線程，一個線程在執行ajax時另外一個進程已經執行return flat了。因此一直返回false.把async改成false，這時纔是同步方式，只有一個線程。

找到緣由後，再修改一下代碼，最終終於成功了。

最終代碼

function checkNewEmail(){
             var flat=false;
             var re_email=new RegExp("\\w+@\\w+\\.\\w+\\.?\\w*");
             var newEmail=$("#email_new").val();
             if(re_email.test(newEmail)){
                 $.ajax({
                     type:"post",
                     dataType:"json",
                     async:false,//同步方式
                     url:"existEmail?email="+newEmail,
                     success:function(dataResult){
                         if(dataResult=="true"){
                             $("#emial-error").text("郵箱已註冊。");
                             flat=false;
                         }else{
                             flat=true;
                         }
                     }
                 });
             }else{
                 $("#emial-error").text("郵箱格式不正確。");
                 return false;
             }
             return flat;
         }

轉自：https://blog.csdn.net/u010079945/article/details/38680769