addClass UL이있는 경우 (jQuery를)

Question

내가 UL이있는 경우 부모 클래스를 추가 할 어디 간단한 드롭 다운을 짓고 있어요 :

는

HTML :

<ul id="menu"> 
    <li><a href="#">Parent 1</a></li> 
    <li><a href="#">Parent 2</a> 
    <ul> 
     <li><a href="#">Sub 2.1</a></li> 
     <li><a href="#">Sub 2.2</a></li> 
    </ul> 
    </li> 
</ul> 

그래서 내가 좋아하는 것 로 :

• 숨기기 모두 (ul#menu > li > ul) UL의 처음
• 쇼/호버
에 ul 중첩 숨기기 중첩 부모에게
• addClass "드롭 다운"중첩 된 그 UL의

이 확실히 작동하지 않습니다, 확실하지 않은 이유 :

$(function() { 
    $("ul#menu li").hover(function() { 
     $(this).addClass("hover"); 
     $('ul:first', this).css('visibility', 'visible'); 
    }, 
    function() { 
     $(this).removeClass("hover"); 
     $('ul:first', this).css('visibility', 'hidden'); 
    }); 
    $("ul#menu li ul li:has(ul)").find("a:first").addClass("dropdown"); 
}); 

많은 당신의 도움을 주셔서 감사!

Answer 1

var ul = $('#menu'); 

if (ul.length) { 
    ul.children('li').hover(function() { 
     $(this).children('ul').show(); 
    }, function() { 
     $(this).children('ul').hide(); 
    }).children('ul').hide().parent().addClass('dropdown'); 
} 

데모 : http://jsbin.com/ofayu

을 BTW : 당신이 당신의 마크 업에 잘못 <li> 태그를 닫는.

Answer 2

이 는 (안된) 트릭을 수행해야합니다

$('ul#menu > li > ul').each(function() 
{ 
    var list = $(this); 
    list.hide(); 
    list.parent().hover(list.hide, list.show); 
    list.parent().parent().addClass('dropdown'); 
}); 

Answer 3

당신이 쓴 :

는 HTML 구조를 감안할 때

$("ul#menu li ul li:has(ul)") 

, 이것은 안 :

$("ul#menu li:has(ul)")