javascript - 单击带有事件监听器和父节点的主体关闭菜单

Question

这个问题已经有答案了:

How do I detect a click outside an element? (91 个回答)

已关闭 7 年前。

我想在单击页面上的任意位置时关闭调整大小的菜单。我搜索了各种堆栈溢出答案，但没有找到一个不会干扰菜单代码本身的答案，我的菜单...

jQuery(document).ready(function($) {
  //open-close submenu on mobile
  $('.cd-main-nav').on('click', function(event) {
    if ($(event.target).is('.cd-main-nav'))
      $(this).children('ul').toggleClass('is-visible0');
  });
  //i have tried adding this but hasn't worked
  $('html').click(function() {
    if ($('.cd-main-nav').children('ul').hasClass('is-visible0')) $(this).children('ul').toggleClass('is-visible0');

  });
});

Answer 1

$('html').click(function() {
     //Hide the menus if visible
});

包含此代码，因为它检测到 html 页面上任意位置的点击还要确保当您单击想要的元素时 html 不会触发

$('.cd-main-nav').on('click', function(event) {
event.stopPropagation();
// rest of your code here
});