javascript - 当我在菜单外单击时如何隐藏 jQuery toggle()？

Question

我找到了几个与此问题相关的主题，但不幸的是，没有一个适合我。 我正在使用这样的 jQuery 方法:

//jQuery
$('.menu_user').click(function(){
    $(".top_menu").toggle();
});
// HTML
<div class="menu_user">MENU</div>
<nav class="top_menu">
  ...
</nav>

基本上，当我点击 MENU div 时，菜单会向下滚动，当我再次点击它时，菜单会向上滚动 = 隐藏。 问题是，当菜单向下滚动并且我在 Menu div 外部单击时，菜单保持显示 - 我想隐藏它。

我浏览了一些教程，但没有找到可以解决此问题的解决方案。

对于此问题的所有帮助，我将很高兴。

谢谢!

Answer 1

您可以执行点击事件，并在其中检查点击是否在 menu_user div 内。 如果没有，那么您可以隐藏下拉菜单。

$("body > div").click(function() {
    if ($(this).attr("class") != "menu_user") {
       $(".top_menu").hide();
    }
});