jQuery下拉菜单列表

Question

感谢您提前的帮助，因为这使我发疯。我要做的是一旦用户单击A＆lt，就会让一个子列表滑下；li class =" submenu">，然后将其滑回OnClick（它正在移动网站上）。我不知道为什么这不起作用。

html：

 <ul class="dropdown">
<li class="subMenu">
    Menu item
    <ul><li>sub 1</li><li>sub 2</li><li>sub 3</li></ul>        
</li>
<li class="subMenu">
    Menu item 2        
    <ul><li>sub 1</li><li>sub 2</li><li>sub 3</li></ul>
</li>
<li class="subMenu">
    Menu item 3
    <ul><li>sub 1</li><li>sub 2</li><li>sub 3</li></ul>
</li>
<li class="subMenu">
    Menu item 4        
    <ul><li>sub 1</li><li>sub 2</li><li>sub 3</li></ul>        
</li>    

CSS：

    ul li {list-style-type: none;}
    ul {overflow:hidden;}
    ul li {cursor:pointer;float:left;padding: 3px;margin:0 5px;width:80px;background:#ccc;}
    ul ul {display:none}
    ul ul li {clear:both;}

JS：

    $(function(){
$(document).mousedown(function(){
    $('.dropdown .active').removeClass('active').children('ul').hide();
})
$('.dropdown').on('mousedown','.subMenu', function(e){
    e.stopPropagation();
    var elem = $(this);
    if(elem.is('.active')) {
        elem.children('ul').slideUp(150);
        elem.removeClass('active');
    } else {
       $('.dropdown .active').removeClass('active').children('ul').hide();
        elem.addClass('active').children('ul').slideDown(150);
    }
});
$('.subMenu').on('mousedown','ul', function(e){
    e.stopPropagation();
    alert('menu item clicked');
});       
    })

请帮助！

垫子

Answer 1

尝试以下替代方案：http：//jsfiddle.net/wfy4t/2/

$("ul li.subMenu").click(function(){
$(this).find("ul").toggle();
});