Jqueryを使用してすべてのフォームフィールドを同時に検証しますか？

Question

私は必要とされているすべてがフォームのフィールドを（検証するために私のカスタムjqueryの検証スクリプトを書きましたが、コードが構造化されている方法は、送信ボタンをクリックしたときにフィールドが（すべてを一度に一つずつ検証していないことです）【選択コードは、すべてのフィールドを同時に検証を受けるように、私はこのコードを変更するにはどうすればよい

$('#contactForm').submit(function() {  

     $(".error").remove(); 

var name = $("#name").val(); 
     var email = $('#email').val(); 
     var subject= $('#subject').val(); 
     var message = $('#message').val(); 

var hasError = false; 

var emailReg = /^[+a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/i; 
if(name == '') { 
     $("#name").after('<span class="error">This field is required.</span>'); 
     hasError = true; 
    } 

else if(subject == '') { 
     $("#subject").after('<span class="error">This field is required.</span>'); 
     hasError = true; 
    } 

else if(message == '') { 
     $("#message").after('<span class="error">This field is required.</span>'); 
     hasError = true; 
    } 

    else if(!emailReg.test(email)) { 
     $("#email").after('<span class="error">Enter a valid email address.</span>'); 
     hasError = true; 
    } 

    else if(email == '') { 
     $("#email").after('<span class="error">Please enter your email address.</span>'); 
     hasError = true; 
    } 

以下の通りです。

Iやったjqueryの検証機能を使用してみてくださいが、何らかの理由のために私はそれを使用しました。それは、他のjquery要素と衝突して、ページに入れられて、値が不足しているにもかかわらずフォームが提出されるようになりました。

から

Answer 1

変更すべてelse if。

if(name == '') { 
     $("#name").after('<span class="error">This field is required.</span>'); 
     hasError = true; 
    } 

if(subject == '') { 
     $("#subject").after('<span class="error">This field is required.</span>'); 
     hasError = true; 
    } 

if(message == '') { 
     $("#message").after('<span class="error">This field is required.</span>'); 
     hasError = true; 
    } 

    if(!emailReg.test(email)) { 
     $("#email").after('<span class="error">Enter a valid email address.</span>'); 
     hasError = true; 
    } 

    if(email == '') { 
     $("#email").after('<span class="error">Please enter your email address.</span>'); 
     hasError = true; 
    } 

Answer 2

filedsが異なって検証され、ユーザーが取得するメッセージがに異なっているとして、あなたは、同時に、例えばによって同じalgorhithmで検証されなければならない代わりに、youcanグループフィールドを、すべてのフィールドを検証することはできませんそれらに同じクラスを設定する（それが空白にすべきではない、すべての入力に対してnotShouldBeBlankクラス名をすることができます）：これは役立つ

$('#contactForm').submit(function() { 

    $.each($('#contactForm .notShouldBeBlank'), function() 
    { 
     if($(this).val() == ''){ 
      $(this).after('<span class="error">This field is required.</span>'); 
     } 
    }); 

    // Other groups validated here 
} 

ホープ！