jqueryは複数のテキストエリアの機能を有効にします

Question

私はプロファイルに関するタブを持つフォームを持っています。aboutセクションでは、検証を実行する必要があるテキストエリアがあります。保存ボタンのクリックに検証する方法を、私は

$（ドキュメント）.ready（関数（）{ $（「＃のbtnSaveMyChanges」）以下のコードのように一つ一つのテキストエリアを検証する必要はありません。（機能をクリックしてください（）{

  var valid = true; 
      if ($("#txtAboutMySelf").val() == "") { 
       $("#ErrorAboutMySelf").html("This Field is Required."); 
       valid = false; 
      } 
      if ($("#txtAboutMyMatch").val() == "") { 
       $("#ErrorAboutMyMatch").html("This Field is Required."); 
       valid = false; 
      } 
      if ($("#txtWhatIamDoing").val() == "") { 
       $("#errmsg").html("invalide"); 
       valid = false; 
      } 
      if ($("#txtIamReallyGood").val() == "") { 
       $("#errmsg").html("invalide"); 
       valid = false; 
      } 
      if ($("#txtTheSixThings").val() == "") { 
       $("#errmsg").html("invalide"); 
       valid = false; 
      } 
      if ($("#txtISpendaLot").val() == "") { 
       $("#errmsg").html("invalide"); 
       valid = false; 
      } 
      if ($("#txtTheFirstThings").val() == "") { 
       $("#errmsg").html("invalide"); 
       valid = false; 
      } 
      if ($("#txtOnaTypicalFriday").val() == "") { 
       $("#errmsg").html("invalide"); 
       valid = false; 
      } 
      if ($("#txtMyFriendsDescribe").val() == "") { 
       $("#errmsg").html("invalide"); 
       valid = false; 
      } 
      return valid; 
     }); 
    }); 

は、関数を作成し、すべてのテキスト領域を取得するフォームを反復処理]をクリックし、保存にして、私はすべてのために500になるようにMAXLENGTHを必要とkeyUpイベントにだけでなく、必要なフィールドの検証を行い、テキストエリア

Answer 1

var valid = true; 
jQuery("#errmsg").html(""); //clear error messages first 

jQuery("textarea").each(function() { 
    if(jQuery(this).val() == "") { 

     var errorText = "invalide"; 
     var id = jQuery(this).attr("id"); 

     if(id == "txtAboutMySelf" || id == "txtAboutMyMatch") { 
      errorText = "This Field is Required."; 
     } 

     var $errMsg = jQuery("#errmsg"); 
     $errMsg.html($errMsg.html() + "<br />" + errorText); //you can't tell which error message belongs to what though; the same problem exists in your original solution. 
     valid = false; 
    } 
}); 

エラーメッセージにコンテキストを提供する方法を理解する必要があります。つまり、エラーメッセージと要素をペアにする必要があります。これを行うには、各要素の横にエラーメッセージのdivまたはspanを作成し、エラーが発生したときにそれを設定します。

Answer 2

私はあなたがこのような何かを行うことができます信じる：

$(document).ready(function() { 
     $("#btnSaveMyChanges").click(function() { 
      var valid = true; 
      if ($("#txtAboutMySelf").val() == "") { 
       $("#ErrorAboutMySelf").html("This Field is Required."); 
       valid = false; 
      } 
      if ($("#txtAboutMyMatch").val() == "") { 
       $("#ErrorAboutMyMatch").html("This Field is Required."); 
       valid = false; 
      } 
      if ($("#txtWhatIamDoing, #txtIamReallyGood, #txtTheSixThings, #txtISpendaLot, #txtTheFirstThings, #txtOnaTypicalFriday, #txtMyFriendsDescribe").val() == "") { 
       $("#errmsg").html("invalide"); 
       valid = false; 
      return valid; 
     }); 
});