Jquery Foreach innerhalb Foreach

Question

Ich versuche, eine Foreach in einer anderen Foreach zu tun. Die erste ist es, jede gefundene WodTabIndex-Klasse zu ermitteln und die Sekunden pro Eingabe, Link und Auswahl zu finden.

hier ist mein Code

var StartId= 500; $('.WodTabIndex').each(function(){ 
     var $this = $(this); 
     $this.children(':input:visible, input[type="checkbox"], a, select').each(function(i){ 
      (this).attr('tabindex', StartId + i); 
        (this).attr('tabindex', StartId + i); 
     }); 
    }); 

ich etwas falsch tue, aber ich weiß nicht, was. weil nie in den sekunden foreach eintritt.

Beispiel Geige: https://jsfiddle.net/lfvo/wk3w237y/

Answer 1

Es gibt zwei Probleme mit dem Code als posted:

Zuerst müssen Sie .find verwenden, anstatt .children. Kinder schauen nur auf die direkten Ableitungen, nicht auf das gesamte DOM unter dem Artikel.

Also für diesen html:

<div id='top'> 
    <ul> 
     <li></li> 
     <li></li> 

Code mit $("#top").children("li") werden die li s nicht finden.

Die zweite ist, dass Sie $(this) innerhalb der Schleife verwenden, müssen Sie sonst bekommen this.attr is not a function

---

aktualisiert Code von der Frage:

var startId = 500; 
$('.WodTabIndex').each(function(){ 
    var $this = $(this); 
    $this.find('input:visible, input[type="checkbox"], a, select').each(function(i){ 
     $(this).attr('tabindex', startId + i); 
    }); 
}); 

Answer 2

for (var i = 0; i <= $('.WodTabIndex').length; i++) { 
 
\t var $this = $($('.WodTabIndex')[i]).children(':input:visible, input[type="checkbox"], a, select'); 
 
\t for (var ii = $($this).length - 1; ii >= 0; ii--) { 
 
\t \t $($($this)[ii]).attr("tabindex", ii+500); 
 
     console.log("Row: "+i+" Checkbox index "+ii+" have attr tabindex: "+(ii+500)); 
 
     // inspect element to see result 
 
     // each checkbox have tabindex 500, 501, 502, ... 
 
    
 
\t } 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="WodTabIndex"> 
 
<input type="checkbox"> 
 
    
 
    
 
    
 
</div> 
 
<div class="WodTabIndex"> 
 
<input type="checkbox"> 
 
<input type="checkbox"> <input type="checkbox"> 
 
    
 
    
 
</div> 
 
<div class="WodTabIndex"> 
 
<input type="checkbox"> 
 
<input type="checkbox"> <input type="checkbox"> 
 
<input type="checkbox"> <input type="checkbox"> 
 
<input type="checkbox"> <input type="checkbox"> 
 
</div>