Question

我觉得我以前见过这个话题，但我找不到它......我一直看到很多5年前的答案，讨论停止传播......

单击主菜单按钮时会弹出一个菜单。如果我单击文档上的任何其他位置，我希望关闭菜单。如果单击菜单按钮或菜单，我不希望发生这种情况......我已经阅读了.not()，但我觉得我错了。< / p>

我没有错过nav中的类选择器 - 它的html5。它只是按照预期弹出我的菜单，但一旦显示就立即隐藏它。

这里缺少什么东西吗？谢谢！

show nav （工作）

$(document).ready(function(){
    $(document).on('click', '.main-menu-button', function(e){
        e.preventDefault();
        //$('nav').animate({width: 'toggle'});
        $(this).toggleClass('active');
        $('nav').slideToggle('fast');
    });
});

隐藏导航

$(document).ready(function(){
    $(document).on('click', function(){
        $('.main-menu-button').removeClass('active');
        $('nav').hide('fast');
    }).not('.main-menu-button, nav');
});

HTML

<header>
<h1>Jimmy's Junk</h1>
<img src = 'http://localhost/inv/img/framework/menu.png' class = 'main-menu-button'>
<nav>
    <ul>
        <li><a href = 'http://localhost/inv'>dashboard</a></li>
        <li><a href = '#'>reports</a></li>
        <li><a href = '#'>settings</a></li>
        <?=$admin?>
        <li><a href = 'http://localhost/inv/modules/login/php/logOut.php'>log out</a></li>
    </ul>
</nav>
<div class = 'clear'></div>
</header>

Answer 1

$(document).on('click', function(event) {
  if ($(event.target).not('.main-menu-button, nav')) {
    $('nav').hide('fast');
  }
});

jquery。不要阻止导航隐藏

1 个答案: