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

好的，我让它像这样工作：

$('.sub-menu > a').click(function(){

        if($(this).parent().find('ul').hasClass('open-menu'))
        {
            $(this).parent().toggleClass('active_menu');
            $(this).parent().find('ul').toggleClass('open-menu');
        }else{
            $('.sub-menu ul.open-menu').toggleClass('open-menu');
            $(this).parent().find('ul').toggleClass('open-menu');
            $('.sub-menu.active_menu').toggleClass('active_menu');
            $(this).parent().toggleClass('active_menu');
        }
    return false;
});

Answer 2

通常我在这种情况下所做的就是给出所有下拉类，例如

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

由于所有下拉都有这个类，所以除了你刚刚点击的那个之外，很容易禁用它们。只需执行以下操作

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

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

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

2 个答案: