jQuery Mega菜单打开和关闭问题

Question

我正在建立一个自定义的大型菜单的网站，我的菜单工作。

当你点击一个带有下拉菜单的链接时，它会打开，如果你点击另一个有下拉菜单的链接，它会关闭打开的链接并打开新链接。

但是我靠近尖叫，因为我希望能够通过单击下拉开放的链接，关闭打开的下拉菜单..

这是我的jQuery至今：

jQuery(document).ready(function($){ 
    $('#menu-main-menu .menu-item-has-children a').click(function(){ 
    $('#menu-main-menu > .menu-open').removeClass('menu-open'); 
    $('.menu-drop').removeClass('menu-drop'); 
    $(this).parent('li').addClass('menu-open'); 
    $(this).parent('li').children('.sub-menu').addClass('menu-drop'); 
    }); 
}); 

任何帮助，将不胜感激。

非常感谢。

继承人的小提琴https://jsfiddle.net/CharlieH/zbtboytc/

Answer 1

我做的jsfiddle你：

https://jsfiddle.net/zbtboytc/1/

jQuery(document).ready(function($){ 

    $('#menu-main-menu .menu-item-has-children').click(function() { 
     if ($(this).hasClass('menu-open')) { 
      $(this).removeClass('menu-open'); 
      $(this).find('.menu-drop').removeClass('menu-drop'); 
     } else { 
     $('.menu-open').removeClass('menu-open'); 
     $('.menu-drop').removeClass('menu-drop'); 
     $(this).addClass('menu-open'); 
     $(this).children('.sub-menu').addClass('menu-drop'); 
     } 
    }); 

}); 

Answer 2

你能给你的HTML代码？

您可以使用.slideToggle（）打开/关闭。

就像那个https://jsfiddle.net/wp6zk5u9/1/

<button>Toggle</button> 
<p> 
    this text slideToggle 
</p> 

和

$("button").click(function() { 
    $("p").slideToggle("slow"); 
}); 

Answer 3

我认为不添加在点击一个链接就可以解决问题的情况下，菜单拖放到父。

jQuery(document).ready(function($){ 
    $('#menu-main-menu .menu-item-has-children a').click(function(){ 
    $('#menu-main-menu > .menu-open').removeClass('menu-open'); 
    $('.menu-drop').removeClass('menu-drop'); 
    if(!$(this).is(a)){ 
     $(this).parent('li').addClass('menu-open'); 
     $(this).parent('li').children('.sub-menu').addClass('menu-drop'); 
    } 
    }); 
});