jquery - 单击其父菜单旁边的后如何隐藏下拉div？

我有这个jQuery代码，它工作正常。最后是一个简单的下拉菜单。单击“ topbar”打开并关闭“ topbarin” div。

$(document).ready(function(){
    $('.topbar').click(function(){
        $('.topbarin').fadeOut(400);
        if($(this).next('.topbarin').is(":visible"))
        {
        $(this).next('.topbarin').fadeOut(400);
        }
        else
        {
        $(this).next('.topbarin').fadeIn(400);
        }
    });
});

这也是一些HTML

<div class="fr"><div class="topbar">SMS Support phones</div>
            <ul class="topbarin">
              <li>Phone 1</li>
              <li>Phone 2</li></ul>
          </div>

但是，单击该菜单旁边的.topbarin后是否有机会淡出？

谢谢！

最佳答案

您可以在此代码之后添加此代码，当单击超出整个菜单时，它将淡出菜单。

$(document).click(function(e){

    if (!$(e.target).hasClass('topbar') ) {
         $('.topbarin').fadeOut(400);
    }
});

关于jquery - 单击其父菜单旁边的后如何隐藏下拉div？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/18669928/