更改兒童類

Question

我有2d數組「active [] []」whan我有0s和1s。首先看一下我的html：

<div class="place"> 
<div class="bigbaractive">1</div> 
    <div class="smallbar"><div class="lock2"></div>1.1</div> 
    <div class="smallbar"><div class="lock2"></div>1.2</div> 
    <div class="smallbar"><div class="lock2"></div>1.3</div> 
    <div class="smallbar"><div class="lock2"></div>1.4</div> 
    <div class="smallbar"><div class="lock2"></div>1.5</div> 
    <div class="smallbar"><div class="lock2"></div>1.6</div> 
    <div class="smallbar"><div class="lock2"></div>1.7</div> 
    <div class="smallbar"><div class="lock2"></div>1.8</div> 
    <div class="smallbar"><div class="lock2"></div>1.9</div> 
</div> 

<div class="place"> 
<div class="bigbaractive">2</div> 
     <div class="smallbar"><div class="lock2"></div>2.1</div> 
    <div class="smallbar"><div class="lock2"></div>2.2</div> 
    <div class="smallbar"><div class="lock2"></div>2.3</div> 
    <div class="smallbar"><div class="lock2"></div>2.4</div> 
</div> 

<div class="place"> 
<div class="bigbaractive">3</div> 
    <div class="smallbar"><div class="lock2"></div>3.1</div> 
    <div class="smallbar"><div class="lock2"></div>3.2</div> 
    <div class="smallbar"><div class="lock2"></div>3.3</div> 
    <div class="smallbar"><div class="lock2"></div>3.4</div> 
    <div class="smallbar"><div class="lock2"></div>3.5</div> 
    <div class="smallbar"><div class="lock2"></div>3.6</div> 
    <div class="smallbar"><div class="lock2"></div>3.7</div> 
</div> 

我要的是改變類smallbars的時候是1，在陣列活躍。只要看看：

jQuery(document).ready(function() 
{ 
    var ile; 
    var smallbars = []; 
    for(var i=0; i<10; i++) 
    { 
     smallbars = $('.place')[i].find('.smallbar'); 
     alert(i); 
     for(var j=0; j<smallbars.length; j++) 
     { 
      if(active[i][j] == 1) 
      { 
       smallbars[j].toggleClass("smallbaractive"); 
       smallbars[j].firstChild.remove(); 
      } 
     } 
    } 

}); 

警報（i）不工作後， 「smallbars = $ [I] .find（ 'smallbar。 '）（' 的地方。'）;」但之前工作。在我的JS代碼中看到任何錯誤？請幫忙。我知道我無法描述你想要什麼，只要告訴我你在哪裏看到任何錯誤。 Greatings，我在等待迴應。

Answer 1

一個jQuery對象上使用組合語法將返回在沒有長包裹在jQuery的DOM元素。一個解決方案是使用.eq(index)代替：

$('.place')[i]  // --> DOM element 
$('.place').eq(i) // --> jQuery object with just that element 

然而，看着你的代碼後，我會建議使用.each寫它做對自己循環更容易：

jQuery(document).ready(function() { 
    var ile; 
    var smallbars = []; 
    $('.place').each(function(indexPlace, elPlace) { 
      $(this).find(".smallbar").each(function(indexSmallBar, elSmallBar) { 
      if (active[indexPlace][indexSmallBar] == 1) { 
        $(this).toggleClass("smallbaractive") 
         .find(">:first-child") 
         .remove(); 
      } 
     }) 
    }) 
}); 

Example Fiddle

如果你想讓你的代碼在最小的變化下工作，你可以簡單地在你使用數組訪問器的兩個地方使用.eq。

Example Fiddle With Minimal Changes

Answer 2

我想這是你想要什麼：

$(document).ready(function() { 
    var active = [[1,2],[3,4],[5,6]]; 
    var i = 0; 
    $('.place').each(function(){ 
     var j = 0; 
     $(this).children('.smallbar').each(function(){ 
      if(active[i][j] == 1) { 
       $(this).toggleClass('smallbaractive'); 
       $(this).children(':first').remove(); 
      } 
      j++; 
     }); 
     i++; 
    }); 
});