jquery - 带有点击事件的多个下拉菜单

Question

所以我在一个页面上有更多的下拉菜单，当我点击一个时，我怎样才能隐藏其他打开的？这是我的代码:

$('nav ul li.sub-menu > a,nav ul li.sub-menu2 > a').click(function(){
    $('.open-menu').toggle();
        $('.active_menu').removeClass('active_menu');
        $(this).parent().toggleClass('active_menu');
        $(this).parent().find('ul').toggleClass('open-menu').toggle();
    return false;
});

我尝试使用 .open-menu 在它处于事件状态时将其添加到下拉列表中，而 active_menu 只是为事件链接设置样式。

//勒

$(document).ready(function() { 
    $('.sub-menu > a').click(function(){
            $('.sub-menu ul').toggleClass('open-menu');
            $(this).parent().find('ul').toggleClass('open-menu');
        return false;
    });
});

现在它不会打开我点击的菜单，它会打开其他菜单

Answer 1

通常我在这种情况下所做的是给所有的下拉列表一个类，例如

<select name="MyDropDown" class="DropDownGroup" > <option>1</opion> </select>

因为所有的下拉菜单都有这个类，所以很容易禁用除您刚刚单击的那个之外的所有下拉菜单。只需执行以下操作

$(".DropDownGroup").live("click", function(){
   $(".DropDownGroup").hide();
   $(this).show();
});

现在这只涵盖点击，因为我认为这是您想要的，但您可能需要在索引更改时执行此操作。