SlideToggle을위한 jQuery 부모와 자녀

나는 쇼핑 사이트를위한 CSS 메뉴를 만들었습니다. 아이디어는 메인 카테고리가 클릭되면 slideToggle이 실행되어 하위 카테고리를로드한다는 것입니다. 원칙을 세우고 jQuery를보고 있습니다. 어린이SlideToggle을위한 jQuery 부모와 자녀

하지만 링크를 클릭하면 아무 것도 일어나지 않습니다.

$('ul.sub_menu').css('display','none'); 

$(".nav-list li a.clickable").toggle(function() { 
    $(this).children().slideToggle(); 
}, function() { 
    $(this).children().slideToggle(); 
}

내 HTML 구조는 다음과 같이 간다

<ul class="nav nav-list"> 
    <li> 

    <a class="clickable" href="#">Christmas</a> 

    <ul class="sub_menu"> 
     <li> 
     <a href="/~sweetdis/category/wreaths" >Wreaths</a> 
     </li> 
     <li> 
     <a href="/~sweetdis/category/large-logs">Large Logs</a> 
     </li> 
    </ul> 

    </li> 
</ul>

오전 난 그냥 여기서 뭔가 누락 ... 다음과 같이

내 jQuery를 무엇입니까?

많은 감사

출처

2012-10-18 StuBlackett

퍼팅 고려 쉽게 도움을 jsfiddle에 – JSantos

jquery에서 slideToggle에 대한 다음 URL을 확인하십시오. [http://stackoverflow.com/questions/9469807/jquery-toggle-to-show-and-hide-a-sub-menu][1] [1] : HTTP : //stackoverflow.com/questions/9469807/jquery-toggle-to-show-and-hide-a-sub-menu – Hamid

이 시도 -

$('.sub_menu').hide(); 
$('.clickable').click(function(){ 
    $(this).next('ul').slideToggle(); 
});

또는 -

$('.ulClass li a:first').click(function(){ 
    $(this).next('ul').slideToggle(); 
});

Working Demo

는 자식이 없기 때문에 당신이 clickable를 클릭하면 아무것도 발생하지 않습니다

이 앵커의 아이가 존재하지 않는이 때 클래스 clickable와 anchor의 어린이를위한 slideToggle 사용하기 때문에

출처

2012-10-18 11:53:41 Dipak

잘됐다. 다음은 아이들이 아니라 앞으로의 길이었다. 많은 감사합니다 – StuBlackett

당신을 환영합니다! :) – Dipak

대신 siblings를 사용할 수 있습니다

이

$('ul.sub_menu').css('display','none'); 

$(".nav-list li a.clickable").click(function() { 
    $(this).siblings('ul.sub_menu').slideToggle(); 
});

뿐인 :http://jsfiddle.net/QqMks/

출처

2012-10-18 11:55:10 Eli

SlideToggle을위한 jQuery 부모와 자녀

답변

관련 문제