Jquery Foreach in Foreach

Question

Я пытаюсь сделать foreach внутри другого foreach. Первый - для каждого найденного класса WodTabIndex и для каждого входа, ссылки и выбора найденного.

вот мой код

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); 
     }); 
    }); 

я делаю что-то неправильно, но я не знаю, что. потому что никогда не заходит за секунды.

Образец скрипку: https://jsfiddle.net/lfvo/wk3w237y/

Answer 1

Есть две проблемы, с кодом, как отвечал:

Во-первых, вам нужно использовать .find вместо .children. Дети смотрят только на прямолинейными, а не на всю DOM под пунктом.

Так что для этого HTML:

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

код с $("#top").children("li") не найдет li с.

Во-вторых, вам нужно использовать $(this) внутри цикла иначе вы получите this.attr is not a function

---

Обновленный код от вопроса:

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>