jquery驗證和ajax調用同時觸發

Question

$("#submit-button").click(function() { 

     if($.trim($("#email").val()) === "") { 
      $(".error-message-email").show(); 
     } 
     if($.trim($("#password").val()) === ""){ 
      $(".error-message-password").show(); 
     } 
     return false; 
    }); 
    $("#submit-button").click(function() { 

    $.ajax({ 
    type:'POST', 
    url:" " , 
    data:{"email": email, "password": password}, 
    success:function(data) { 

     if(data["success"] === "True") { 
        // do something. 
       } else { 

      if(data["message"] === "Email already exists.") { 
       $(".error-message-email-exist").show(); 
      }  

       } 
    }, 
    dataType:"json" 
    }); 

    return false; 
    }); 

}); 

我有問題。如果發生錯誤，那麼如何停止Ajax調用來觸發。因爲這裏仍然是我的表單未能通過驗證，所以ajax調用被觸發。我想阻止它。

Answer 1

不要點擊事件分開。

$("#submit-button").click(function() { 
    var error = false; 
    if($.trim($("#email").val()) === "") { 
     $(".error-message-email").show(); 
     error = true; 
    } 
    if($.trim($("#password").val()) === ""){ 
     $(".error-message-password").show(); 
     error = true; 
    } 

    if(!error) { 

      $.ajax({ 
       type:'POST', 
       url:" " , 
       data:{"email": email, "password": password}, 
       success:function(data) { 

        if(data["success"] === "True") { 
         // do something. 
        } else { 

        if(data["message"] === "Email already exists.") { 
         $(".error-message-email-exist").show(); 
        }  

        } 
       }, 
       dataType:"json" 
     }); 

    } 
    return false; 
}); 

Answer 2

像這樣：

$("#submit-button").click(function() { 
     var error = false; 
     if($.trim($("#email").val()) === "") { 
      $(".error-message-email").show(); 
      error = true; 
     } 
     if($.trim($("#password").val()) === ""){ 
      $(".error-message-password").show(); 
      error = true; 
     } 
     if (!error) { 
      $.ajax({ 
       type:'POST', 
       url:" " , 
       data:{"email": email, "password": password}, 
       success:function(data) { 

        if(data["success"] === "True") { 
        // do something. 
        } else { 

        if(data["message"] === "Email already exists.") { 
         $(".error-message-email-exist").show(); 
        }  

       } 
      }, 
      dataType:"json" 
      }); 
     } 
     return false; 
    }); 

Answer 3

既然你已經綁定click兩次，並寫在第二個Ajax調用，則無論第一個開火。它是完全獨立的。