Wie durchläuft das Formular mit zufälligen Elementen

Question

Ich versuche, das Formular mit label innerhalb von zufälligen Elementen durchlaufen und überprüfen, ob die Bezeichnung mit dem angegebenen Namen übereinstimmt und wenn Übereinstimmungen, ich eine Klasse zu diesem Element hinzufügen . Aber ich kann es nicht funktionieren, wie kann ich das machen?

Hier ist was ich versucht habe.

Formular, die Etiketten innerhalb zufällige Elemente wie div

<form id="grtform"> 
    <div id="section-1"> 
     <lable>Currency type</lable> 
     <input type="text" name="currencyType"> 
    </div> 

    <div id="section-2"> 
     <lable>Currency rate</lable> 
     <input type="text" name="currencyRate"> 
    </div> 

     <lable>Currency of country</lable> 
     <input type="text" name="currencyCountry"> 

    <div id="section-3"> 
     <div class="formData"> 
      <lable>Currency due</lable> 
      <input type="text" name="currencyDue"> 
     </div> 
    </div> 
    </form> 

Jquery Code hat:

$("#grtform").each(function(){ 
       var matchLable = "Currency due" 
       var lable = $(this).find('label').text(); 
       if(matchLable == lable){ 
        $(this).addClass('matchFound'); 
       } 
     }); 

Answer 1

Sie benötigen eine Schleife durch lables, nicht gegen die Form

$("#grtform lable").each(function(){ // selecting all labels of form 
       var matchLable = "Currency type" 
       var lable = $(this).text(); // changed here too 
       if(matchLable == lable){ 
        $(this).addClass('matchFound'); 
       } 
     }); 

In obigen Code, Dies bezieht sich auf das aktuell iterierende Label.

Nach dem Trimmen ein wenig

$("#grtform lable").each(function(){ // selecting all labels of form 
       if($(this).text() == "Currency type"){ 
        $(this).addClass('matchFound'); 
       } 
     }); 

Answer 2

Sie können auch wie folgt verwendet werden: -

var allLables = document.querySelectorAll("#grtform lable"); 
 
for(var i = 0; i < allLables.length; i++){ 
 
    var matchLable = "Currency type"; 
 
    var lable = allLables[i].innerText; // changed here too 
 
    if(matchLable == lable){ 
 
    allLables[i].classList.add("matchFound"); 
 
    } 
 
}

<form id="grtform"> 
 
    <div id="section-1"> 
 
     <lable>Currency type</lable> 
 
     <input type="text" name="currencyType"> 
 
    </div> 
 

 
    <div id="section-2"> 
 
     <lable>Currency rate</lable> 
 
     <input type="text" name="currencyRate"> 
 
    </div> 
 

 
     <lable>Currency of country</lable> 
 
     <input type="text" name="currencyCountry"> 
 

 
    <div id="section-3"> 
 
     <div class="formData"> 
 
      <lable>Currency due</lable> 
 
      <input type="text" name="currencyDue"> 
 
     </div> 
 
    </div> 
 
    </form>