Javascript 需要禁用下拉（仅）菜单的淡出功能

我在移动模式下的菜单有问题。一旦点击，它就会消失。我想保持这个设置，但我不想在单击下拉部分时它消失。 以下是链接： 谢谢你的帮助

html:

<nav id="nav-wrap"> <a class="mobile-btn" href="#nav-wrap" title="Show navigation">Show Menu</a>
 <a class="mobile-btn" href="#" title="Hide navigation">Hide Menu</a> 
    <ul id="nav" class="nav">
        <li><a class="smoothscroll mobile" href="#about">about</a>
        </li>
        <li><a class="smoothscroll mobile" href="#documents">blog</a>
        </li>
        <li class="nav-item"><a href="#">dropdown</a> 
            <ul class="langop">
                <li><a href="#">otion 1</a>
                </li>
                <li><a href="#">otion 2</a>
                </li>
            </ul>
        </li>
    </ul>
</nav>

.langop {
    display:none;
    position: relative;
    width:auto;
}
.nav-item:hover .langop {
    display: block;
}

var toggle_button = $("<a>", {
    id: "toggle-btn",
    html: "Menu",
    title: "Menu",
    href: "#"
});
var nav_wrap = $('nav#nav-wrap')
var nav = $("ul#nav");


nav_wrap.find('a.mobile-btn').remove();
nav_wrap.prepend(toggle_button);

toggle_button.on("click", function (e) {
    e.preventDefault();
    nav.slideToggle("fast");
});

if (toggle_button.is(':visible')) nav.addClass('mobile');
$(window).resize(function () {
    if (toggle_button.is(':visible')) nav.addClass('mobile');
    else nav.removeClass('mobile');
});

$('ul#nav li a').on("click", function () {
    if (nav.hasClass('mobile')) nav.fadeOut('fast');
});

java:

<nav id="nav-wrap"> <a class="mobile-btn" href="#nav-wrap" title="Show navigation">Show Menu</a>
 <a class="mobile-btn" href="#" title="Hide navigation">Hide Menu</a> 
    <ul id="nav" class="nav">
        <li><a class="smoothscroll mobile" href="#about">about</a>
        </li>
        <li><a class="smoothscroll mobile" href="#documents">blog</a>
        </li>
        <li class="nav-item"><a href="#">dropdown</a> 
            <ul class="langop">
                <li><a href="#">otion 1</a>
                </li>
                <li><a href="#">otion 2</a>
                </li>
            </ul>
        </li>
    </ul>
</nav>

.langop {
    display:none;
    position: relative;
    width:auto;
}
.nav-item:hover .langop {
    display: block;
}

var toggle_button = $("<a>", {
    id: "toggle-btn",
    html: "Menu",
    title: "Menu",
    href: "#"
});
var nav_wrap = $('nav#nav-wrap')
var nav = $("ul#nav");


nav_wrap.find('a.mobile-btn').remove();
nav_wrap.prepend(toggle_button);

toggle_button.on("click", function (e) {
    e.preventDefault();
    nav.slideToggle("fast");
});

if (toggle_button.is(':visible')) nav.addClass('mobile');
$(window).resize(function () {
    if (toggle_button.is(':visible')) nav.addClass('mobile');
    else nav.removeClass('mobile');
});

$('ul#nav li a').on("click", function () {
    if (nav.hasClass('mobile')) nav.fadeOut('fast');
});

var-toggle_按钮=$（“”{
id:“切换btn”，
html：“菜单”，
标题：“菜单”，
href:#”
});
var nav#u wrap=$（'nav#nav wrap'）
var nav=$（“ul#nav”）；
nav_wrap.find（'a.mobile-btn'）.remove（）；
导航包裹前置（切换按钮）；
切换按钮。打开（“单击”，功能（e）{
e、 预防默认值（）；
导航滑动切换（“快速”）；
});
if（toggle_button.is（'：visible'））nav.addClass（'mobile'）；
$（窗口）。调整大小（函数（）{
if（toggle_button.is（'：visible'））nav.addClass（'mobile'）；
else导航removeClass（“移动”）；
});
$（'ul#nav li a'）。打开（“单击”，函数（）{
如果（导航类（“移动”）导航淡出（“快速”）；
});

请参见此

看这个

---

使用查找单击的元素，如果它是下拉部分，则不要隐藏

var切换按钮=$（“

使用查找单击的元素，如果它是下拉部分，则不要隐藏

var切换按钮=$（“

我试过：$（'ul#nav li a'）。在（“点击”，函数（e）{var target=$（“.langop”）；如果（！target.is（“.langop”）//检查点击的项目是下拉列表）如果（nav.hasClass（'mobile'））nav.fadeOut（'fast'）；}）；但是现在，无论我点击

var target=$（.langop”）；如果（！target.is），菜单都不会消失（e.target）和&target.has（e.target）.length==0&&nav.hasglass（'mobile'））nav.fadeOut（'fast'）；

明白了，我之前不清楚，将类更改为.nav项并得到了我想要的，谢谢我尝试了：$（'ul#nav li a'）。点击（“click”，函数（e）{var target=$（.langop”）；如果（！target is（“.langop”）//检查单击的项是下拉列表）if（nav.hasClass（'mobile'））nav.fadeOut（'fast'）；}）；但是现在，无论我单击

var target=$（“.langop”）；if（！target.is（e.target）&&target.has（e.target）。length==0&nav.hasClass（'mobile'））nav.fadeOut（'fast'））

明白了，我之前不清楚，将类更改为.nav项，得到了我想要的，谢谢