Jquery 콜론 자식 카운트 문제 (n 번째 자식)

div라는 'div.cloneFrame'이 있는데 jquery.clone을 사용하여이를 복제하고 있습니다. 그것을 잘 작동합니다 그리고 난이 기능을 사용하여, 내가 필요로하는 모든 복제 :Jquery 콜론 자식 카운트 문제 (n 번째 자식)

이

var needToClone = 4; 
    var totalImgs = 0; 
    for(i=0;i<needToClone;i++){ 
     $('div.cloneFrame').clone() 
     .removeClass('cloneFrame') 
     .appendTo('.frame-group').each(function(){ 
      var imgSrcLength = $(this).find('img'); 
      for(j=0;j<imgSrcLength.length;j++){ 
       totalImgs++; 
       $(imgSrcLength[j]).attr('src','imgs/outfits/'+totalImgs+'.jpg'); 
      } 
     }) 
    } 
    $('div.cloneFrame').remove();

나중에 내가 그것을 위해 내가 n 번째 자식 기능

$('div.myframe:nth-child('+1+')').addClass('incoming').next().addClass('outgoing');

그러나 작동하지를 사용하고, 복제 된 DIV를 선택해야합니다. 만약 내가 이것을 사용한다면 :

$('div.myframe:nth-child('+3+')').addClass('incoming').next().addClass('outgoing');

그것은 잘 작동하고 있습니다. n 번째 자녀에게 2 자리 숫자를 건너 뛸 필요가있는 이유는 무엇입니까? 내 편이 잘못 됐어?

내 HTML :

<div class="frame-group"> 

      <div class="cloneFrame myframe"> 
       <div id="orange-frame" class="product-frame"> 
        <a class="purchase-btn" href="#">Purchase this item</a> 
        <img alt="women coat" src="imgs/yellow-coat.jpg"> 
       </div> 
       <div id="yellow-frame" class="product-frame"> 
        <a class="purchase-btn" href="#">Purchase this item</a> 
        <img alt="blue coat" src="imgs/coat-blue.jpg"> 
       </div> 
       <div id="brown-frame" class="product-frame"> 
        <a class="purchase-btn" href="#">Purchase this item</a> 
        <img alt="women shoe" src="imgs/women-shoe.jpg"> 
       </div> 
       <div id="green-frame" class="product-frame"> 
        <a class="purchase-btn" href="#">Purchase this item</a> 
        <img alt="women jean" src="imgs/jean.jpg"> 
       </div> 
      </div> 


      <span class="outfit-no">outfit no.<span>01</span></span> 
      <a class="buy-outfit" href="#">Buy outfit</a> 
     </div>

방문 : http://jsbin.com/iquxaq/3 JQuery와 :nth-child() 선택에서

출처

2011-12-14 3gwebtrain

:와

: n 번째 자녀 (N), 모든 어린이는 관계없이 계산됩니다 그들은 이고, 은 지정된 요소가 01과 일치하는 경우에만 선택됩니다선택기가 의사 클래스에 연결되었습니다. : eq (n) 의사 클래스에 부착 된 셀렉터 만이 카운트되며 다른 요소의 자식에 국한되지 않고 의 하위 항목에 한정되지 않고 (n + 1) 번째 (n은 0 기반)가 선택됩니다.

솔루션 내 테스트에 관계없이

$('div.myframe:nth-child(1)') 시도는 div.myframe는 첫 아이가있는 경우보고이 요소가 클래스 = "MyFrame을"이있는 경우. 이 경우에는 <span class="outfit-no">outfit no.<span>01</span></span>이므로 아무 것도 잡히지 않습니다. $('div.myframe:nth-child(2)')에 대한 그 후
는 두 번째 아이를 잡아하려고하지만 아직 아닌 .myframe, 그것은 <a class="buy-outfit" href="#">Buy outfit</a> 그래서 아무것도 저장되지 않습니다이다.
지금 $('div.myframe:nth-child(3)') 세 번째 아이를 잡기 위해 시도하고 <div class="myframe"> 그래서 그것을 저장 이후 그것은 .myframe을합니다.

는 대체는 경우

jquery eq() 선택, 그것은 큰 더 적절한 작동합니다 :

// select the first child  
$('div.myframe').eq(0); 
// instead of 
// $('div.myframe:nth-child(1)')

으로 : (n)의 EQ 의사에 부착 에만 선택을 - 클래스는 다른 요소의 자식에 국한되지 않고, 으로 계산됩니다.

출처

2011-12-14 08:10:30 phemios

Jquery 콜론 자식 카운트 문제 (n 번째 자식)

답변

관련 문제