Get rodziców i pierwsze dziecko rozpiętości jQuery

Question

mam tę strukturę:

<div class="list"> 
    <ul> 
     <li> 
      <span class="number">1</span> 
      <p class="list-title"><a href="#">Welcome</a></p> 
      <img src="images/like.png" class="like" /> 

      <div class="subcomments"> 
       <div class="comments"> 
       <ul> 
        <li> 
         <span class="number">2</span> 
         <img src="images/like.png" class="like" /> 
        </li> 
       </ul> 
      </div> 
     </div> 
    </li> 
</ul> 

I chcę gdy kliknięcie na klasę „jak” pojawia się treść span.number, czyli idzie do ojca i pobiera zawartość przęsła z numerem klasy.

Próbuję to:

$('.like').parent().children('span:first').text() 

Ale zawsze daje mi 1 w dwóch sytuacjach, zamiast podawać 1 w pierwszym jak i 2 w drugim podobnego.

Answer 1

Trzeba jQuery siblings(),

Live Demo

$('.like').siblings('span:first').text(); 

Answer 2

należy użyć this

$(.link).click(function() { 
    $(this).parent().find('.number').text(); 
    // $(this).parent().find('span:first').text(); // same thing 
    // $(this).closest('.number').text();   // same thing 
}) 

po prostu napisać $('.link').parent().find('span:first').text(); zawsze zajmie pierwsze .link klasę i wziąć jego wartość rozpiętości podczas korzystania this używa dokładnie tego .link że wybrałeś

Answer 3

użytkowania .siblings():

$('.like').siblings('span:first').text(); 

To samo w sobie zawsze pokaże 1 - ponieważ selektor .like zwraca 2 elementy - z następującym kodem (.siblings('span:first').text();) działającym przeciwko pierwszemu elementowi za każdym razem - musisz użyć każdego do zapętlenia każdej wartości:

$('.like').each(function() { 
    alert($(this).siblings('span:first').text()); 
})​ 

Example here