메뉴에서 링크를 전환 하시겠습니까?

Question

링크가 하위 항목에서만 작동하도록 만드는 방법은 무엇입니까?

<ul> 
    <li><a href="item-1">Item 1</a> 
     <ul> 
      <li><a href="item-1-1">item 1.1</a></li> 
     </ul> 
    </li> 

    <li><a href="item-2">Item 2</a></li> 

    <li><a href="item-3">Item 3</a> 
     <ul> 
      <li><a href="item-3-1">item 3.1</a> 
       <ul> 
        <li><a href="item-3-1-3">item 3.1.1</a></li> <li><a href="item-3-1-2">item 3.1.2</a></li> 
       </ul> 
      </li> 
     </ul> 
    </li> 
</ul> 

나는 아주 기본적인 예제를 만들었습니다.

$('ul').on('click','a',function(){ 

    if ($(this).next('ul').toggle()) return false; 

}); 

링크 하위 항목 그리고 만약이 수도 토글 링크 그들은 HREF의 위치로 이동보다하지,하지만 실 거예요 작업, 왜? .toggle()이 가 존재하지 않는 요소라고해도falsy 값을 반환하지 않습니다 때문에 nested menu

Answer 1

그것은이다

ul li ul { 
    display:none; 
} 

실제로, 여기에 바이올린입니다. 따라서 if 상태는 if ($(this).next('ul').toggle())이며, 항상 은입니다.

변경 그것은에 :

$('ul').on('click','a',function(){ 
    if ($(this).next('ul').length > 0) { 
     $(this).next('ul').toggle(); 
     return false; 
    } 
}); 

Working demo