1つのテキストエリアが空であるか5文字未満の場合、アラートを表示しません。

Question

以下は、空白または5文字以下のテキストエリアを検証するためのコードです。

function validation() { 

       var context = $('#optionAndAnswer'); 
    var currenttotal = context.find('.answerBtnsOn').length;  

    alertValidation= ""; 
     // Note, this is just so it's declared... 

    var textAreaO = $(".textAreaQuestion"); 

    if (textAreaO.val() == ""){ 
     alertValidation += "\nYou have not entered a valid Question\n"; 
    } else if (textAreaO.val().length < 5){ 
     alertValidation += "\nYou have not entered a valid Question\n"; 
    } 


    if(alertValidation != "") 
    { 
     alert(alertValidation); 
     return false; 
    } 

    return true; 
} 

問題は、それは私が同じクラス（.textAreaQuestion）との2つのテキストエリアを持って言うことができます2つのテキストエリアの一つ一つが空であるか、5文字未満場合、は、何の検証（ノーアラートはありません表示されます）が正しく表示されます。両方のテキストエリアが空であるか、5文字未満の場合にのみ表示されます。では、このコードをどのように操作して、空であるか5文字未満の多くのテキストエリアの中にテキストエリアがある場合、警告を表示することができますか？

おかげ

Answer 1

.val()方法は、最初に一致した要素の値を返します。

説明：の現在の値を取得する最初の要素一致する要素のセットに。

個別に処理するには、一致する要素を繰り返し処理する必要があります。このような何か：。

$(".textAreaQuestion").each(function() { 
    if (!this.value || this.value.length < 5) { 
     alertValidation += "\nYou have not entered a valid Question\n"; 
    } 
}); 

DEMO

Answer 2

あなたのセレクタは.val()を呼び出す複数の要素が一致最初要素の値だけを返します一致した場合。すべてを検証する場合は、.each()関数を使用してすべての要素を反復処理する必要があります。

Answer 3

あなたはeachを使用して.textAreaQuestionを反復処理する必要があります。

var textAreaO = $(".textAreaQuestion"); 

textAreaO.each(function() { 
  if ($(this).val() == ""){ 
    alertValidation += "\nYou have not entered a valid Question\n"; 
    } else if ($(this).val().length < 5){ 
      alertValidation += "\nYou have not entered a valid Question\n"; 
    } 
}); 
//...