.slide .click을 기반으로 개별적으로 타겟팅하는 클래스

Question

기본적으로 다음과 같이 작성하려고합니다. 버튼을 클릭하고 연결된 .slideToggle (s) 관련 .box Div. 여러 메소드를 시도하려면 컨테이너 div 안에 중첩하십시오.

나는 어리석은 느낌이 여러 번 요청되었습니다. 나는 적어도 12 가지를 시도해 보았습니다.

코드는 여기에 있습니다.

http://jsfiddle.net/BurRQ/25/

<div class="container"> 
    <div class="header"> 
     <a href="#" class="toggle">TOGGLE</a> 
    </div> 
    <div class="box"> 
     <p>Content</p> 
    </div> 
</div>​ 

건배.

Answer 1

.next을 사용하기 전에 .parent 메서드를 사용하여 헤더로 다시 이동해야합니다.

http://jsfiddle.net/BurRQ/26/

$('.toggle').click(function(){ 
    $(this).parent().next('.box').slideToggle("slow"); 
}); // .click 

Answer 2

이 작업을 수행하는 방법에는 여러 가지가 있습니다

$('.toggle').click(function(){ 
    $(this).next('.box').slideToggle("slow"); 
}); // .click 

후 전에, 여기

(나는 그들에게 이름을 줄 수 있기 때문에) 세 가족 방식 : $(this).parent().siblings('.box').slideToggle();

가장 가까운 찾기 방법 : $(this).closest('.container').find('.box').slideToggle();

다음 부모 방법 : $(this).parent().next().slideToggle();