jQuery表單驗證在多個if語句中不起作用

Question

我有jQuery驗證問題。

HTML：

<form action="#" name="validate" onsubmit="return validateRegistration();"> 
    <input type="text" id="username" value="Username" /> 
    <input type="text" id="email" value="Email" /> 
    <input type="text" id="phone" value="Phone" /> 
</form> 

function validateRegistration() { 

    var username = $('#username').val(); 
    var email = $('#email').val(); 
     var phone = $('#phone').val(); 

    if(username=='' || username == 'Username'){ 
     $('#username').after('<span class="error">Enter a username</span>'); 
    } 

    if(email=='' || email == 'Email'){ 
     $('#email').after('<span class="error">Please enter a valid email address</span>'); 
    } 

    if(phone=='' || phone == 'Phone'){ 
     $('#phone').after('<span class="error">This field is required.</span>'); 
     return false; 
    } 
} 

驗證工作時的形式中沒有任何價值。如果我只填寫電話字段，則表單將以return true提交。我不能在所有字段中輸入return false，因爲所有驗證錯誤都應該一次顯示。我給出的代碼簡短而且原創。我有30多個領域，所以任何主要的變化都是痛苦的。任何幫助？

Answer 1

function validateRegistration() { 
     var notError = true; 
     var username = $('#username').val(); 
     var email = $('#email').val(); 
      var phone = $('#phone').val(); 

     if(username=='' || username == 'Username'){ 
      $('#username').after('<span class="error">Enter a username</span>'); 
      notError = false; 
     } 

     if(email=='' || email == 'Email'){ 
      $('#email').after('<span class="error">Please enter a valid email address</span>'); 
      notError = false; 
     } 

     if(phone=='' || phone == 'Phone'){ 
      $('#phone').after('<span class="error">This field is required.</span>'); 
      notError = false; 
     } 

     return notError; 
    } 

希望這將滿足您的需求