javascript - 单击时一次显示一个

$(".cus-nav .navbar-nav > li").click(function(){
    $(this).find(".mega-menu").slideToggle("fast");
 });

当我单击li时，大型菜单将打开并切换。当我单击另一个li时，它将打开它的大型菜单。但是第一大菜单仍然打开。所以我想当单击li一次只显示一个大型菜单时。

最佳答案

您能否在显示所需菜单之前就隐藏所有大型菜单？

$(".cus-nav .navbar-nav > li").click(function(){
    $(".mega-menu").hide();
    $(this).find(".mega-menu").slideToggle("fast");
});

如果只需要对关闭的动画进行动画处理，则可以在打开它时添加一个类，以便稍后再找到它

$(document).ready(function() {
    $(".navbar-bar > li").click(function() {
        var $showMenu = $(this).find(".mega-menu");
        var openMenu = !$showMenu.hasClass("opened");

        var $closeMenu = $(".mega-menu").filter(".opened");
        $closeMenu.removeClass("opened");
        $closeMenu.slideToggle("fast");

        if(openMenu){
            $showMenu.addClass("opened");
            $showMenu.slideToggle("fast");
        };
    });
});