简化javascript点击计数菜单，控制3个单独的下拉菜单

我的页面顶部有3个单独的幻灯片菜单

页面菜单 帐户下拉列表 购物车下拉列表 我已经为每个函数创建了单独的打开和关闭函数

function menu_open(){ 
                document.getElementById("myNav_overlay").style.height = "100%";
                document.getElementById("myNav").style.height = "100%";
                $('.menu-link').text("menu_open");
        }

   function menu_close() {
                document.getElementById("myNav_overlay").style.height = "0%";
                document.getElementById("myNav").style.height = "0%";
                $('.menu-link').text("menu");
        }

        function account_open(){ 
                document.getElementById("myAccount_overlay").style.height = "100%";
                document.getElementById("myAccount").style.height = "100%";
                $('.account-link').text("person");
        }

        function account_close() {
                document.getElementById("myAccount_overlay").style.height = "0%";
                document.getElementById("myAccount").style.height = "0%";
                $('.account-link').text("person");
        }

        function cart_open(){ 
                document.getElementById("myCart_overlay").style.height = "100%";
                document.getElementById("myCart").style.height = "100%";
                $('.cart-link').text("shopping_cart");
        }

        function cart_close() {
                document.getElementById("myCart_overlay").style.height = "0%";
                document.getElementById("myCart").style.height = "0%";
                $('.cart-link').text("shopping_cart");
        }

然后使用3个单独的单击计数功能来确定菜单是否需要打开或关闭

    $(function() {  
    var menuclickCount = 0;
    var accountclickCount = 0;
    var cartclickCount = 0;

    $('.menu-link').click(function () {
        if(menuclickCount%2==0){
            //do when open
              menu_open();
              account_close();
              cart_close();
        }else{
             //do when closed
             menu_close();
         }
        clickCount++;
    });

    $('.account-link').click(function () {
        if(accountclickCount%2==0){
            //do when open
              account_open();
              menu_close();
              cart_close();
        }else{
             //do when closed
             account_close();
         }
        accountclickCount++;
    });


    $('.cart-link').click(function () {
        if(cartclickCount%2==0){
            //do when open
              cart_open();
              menu_close();
              account_close();
        }else{
             //do when closed
             cart_close();
         }
        cartclickCount++;
    });


});

与必须的相比，这似乎相当大，似乎有更好/更简单的方法。但老实说，我不确定这通常是如何做到的

是否最好保持这样的设置，即每一个单独控制并手动关闭另一个？或者，将这些功能组合成一个更强大、更小的功能，仍然可以根据需要控制它们，这样更好吗

如果合并成一个更简单的函数更好，那么在它仍然打开和关闭每个下拉部分的地方，该如何操作呢

我使用了1个工作函数并复制了它，使其按原样工作。所以现在我很好奇，看看这与被认为是行业标准和实用的东西相比如何

HTML很简单

菜单内容

帐户内容

购物车内容

---

不用过多地设置示例的样式，使用jQuery的神奇功能，您可以做到以下几点：

1单击，选择我的示例中的所有菜单容器class.ddown

2通过删除具有新高度的.showMenu类，将所有菜单容器返回其默认高度0

3仅对于单击的容器，应用增加容器高度的样式

$'.ddown'。单击函数{ $'.ddown'.removeClass'showMenu'； $this.addClass'showMenu'； }; .container{高度：100px；} .ddown{显示：内联块；宽度：100px；边框：1px实心ccc；溢出：隐藏；} .mnuTitle{高度：20px；} .mnuContent{高度：0；背景：白色；} .showMenu{高度：100px；背景：淡绿色；} 菜单 菜单内容 账户 帐户内容 运货马车 购物车内容

---

我喜欢这种格式和简单。我的链接不是下拉列表的一部分。我需要这个来处理孤立的链接。同样，同样的链接需要能够打开和关闭相关的下拉列表。当然，发布您的代码或等效的简化示例，我们将尽力提供帮助。

<div id="myNav_overlay" class="overlay_background"></div>
<div id="myNav" class="nav-overlay">
<div class="overlay-content">
MENU
</div>
</div>

<div id="myAccount_overlay" class="overlay_background"></div>
<div id="myAccount" class="account-overlay">
<div class="overlay-content">
ACCOUNT
</div>
</div>

<div id="myCart_overlay" class="overlay_background"></div>
<div id="myCart" class="cart-overlay">
<div class="overlay-content">
CART
</div>
</div>