单击外部菜单时关闭下拉菜单

Question

我有以下

function subNavToggle() {
var subNav = document.getElementById("subnav-section");
if (subNav.className === "navigation-subnav") {
subNav.className += " responsive";
} else {
subNav.className = "navigation-subnav";
}
}

我正在尝试在单击菜单外部时关闭扩展菜单。

我有这个，它会关闭菜单，但它也会关闭汉堡菜单——防止用户再次打开。

$(document).click(function(event) { 
var $target = $(event.target);
if(!$target.closest('.sub_nav_links').length && 
$('.sub_nav_links').is(":visible")) {
$('.sub_nav_links').hide();
}        
});

我还以为我可以逃脱以下惩罚，但事实恰恰相反。正在打开外部菜单项。

window.onclick = subNav;

Answer 1

$('html').on('click, touchend', function (e) {
// Close hamburger menu when tapping outside
if ($(e.target).closest('#subnav-section').length == 0) {
var opened = $('.navigation-subnav').hasClass('responsive');
if (opened === true) {
$('.navigation-subnav').collapse('hide');
}
}
});

Answer 2

// to hide
$(document).click(function(){
$("#submenu").hide();
});
// you could possibly prevent to hide menu while using navigation
$("#menu").click(function(e){
e.stopPropagation();
});