javascript - super 下拉菜单

Question

我创建了一个 Mega Menu，但我不精通 javascript/jquery。我已经应用 .slideToggle 来在点击时显示下拉菜单。如果有人在打开第二个下拉菜单时单击第二个下拉菜单，我想自动关闭第一个下拉菜单。我在这里问之前试过谷歌。下面是我使用的脚本以及 Codepen 的链接。

Codepen link for Mega Menu

如有任何帮助，我们将不胜感激。提前致谢。

$(function(){
$(".about").click(function(){
    $(".mainSub").slideToggle("slow");
    $(".one").toggleClass("aboutClick");       
})
$(".hf").click(function(){
    $(".hfnav").slideToggle("slow");
    $(".two").toggleClass("aboutClick");
})
$(".cntct").click(function(){
    $(".three").toggleClass("aboutClick");
})
})

编辑:如果有人点击 Housing Finance，我希望“关于我们”下拉菜单关闭，而 Housing finance 下拉菜单的内容应该出现。

Answer 1

我认为根据您的代码笔链接，您正在寻找

$(function(){
    $(".about").click(function(){
        $(".mainSub").slideToggle("slow");
        $('.mainNavSub>*').removeClass('aboutClick');
        $(".one").addClass("aboutClick");       
    });
    $(".hf").click(function(){
        $(".hfnav").slideToggle("slow");
        $('.mainNavSub>*').removeClass('aboutClick');
        $(".two").addClass("aboutClick");
    });
    $(".cntct").click(function(){
        $('.mainNavSub>*').removeClass('aboutClick');
        $(".three").addClass("aboutClick");
    });
});

它从其他对象中删除该类并将该类添加到当前对象。