我有这个菜单用于使用引导程序 4 显示子下拉菜单：
<span class="menu-toggle">click</span>
<nav class="responsive-menu top-menu menu_wrap d-block d-lg-none d-xl-none open">
<div class="menu_scroll_content">
<ul class="menu_wrap">
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home current-menu-item page_item page-item-140 current_page_item menu-item-143 active"><a href="">home</a></li>
<li class="menu-item-has-children mega_menu menu-item menu-item-type-custom menu-item-object-custom menu-item-60 mega_menu mega_menu_advanced dropdown">
<a title="menu" href="#" data-toggle="dropdown" class="dropdown-toggle" aria-haspopup="true"> menu <span class="caret"></span></a>
<ul role="menu" class=" dropdown-menu">
<li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-65 dropdown-submenu">
<a title="child menu" href="#">child menu</a>
<ul role="menu" class=" dropdown-menu">
<li class="menu-item menu-item-type-post_type menu-item-object-card menu-item-70">
<a title="child menu 1" href="">child menu 1</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-card menu-item-83">
<a title="child menu 2" href="">child menu 2</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
</nav>
JS：
//menu
$(document).on("click", ".menu-toggle", function(e) {
e.preventDefault();
$("body").addClass("open-nav");
$(".top-menu").toggleClass("open");
$(".overlay").toggleClass("show");
});
$(document).on("click", ".overlay,.close_nav", function() {
$(".overlay").removeClass("show");
$(".top-menu").removeClass("open");
$("body").removeClass("open-nav");
});
$(document).on("click", ".responsive-menu .menu-item-has-children>a", function(e) {
e.preventDefault();
e.stopPropagation();
console.log("menu click");
//$('.menu_wrap>li').removeClass('menu-show');
$(this).parent().toggleClass("menu-show");
});
现在在单击menu显示child menu和单击child menu显示子子菜单时起作用，但是当我需要关闭menu并单击menu不最近的菜单时。如何解决这个问题！？
在这里演示（在平板电脑或移动设备上预览）
