如何隐藏子菜单时，其他菜单单击JQuery

How to hide sub-menu when other menu clicked JQuery

本文关键字：菜单 单击 JQuery 其他 何隐藏 隐藏      更新时间：2023-09-26

我想找出一件事，我有一个单页网站，并希望隐藏子菜单下的投资组合当其他菜单链接点击http://jsfiddle.net/kuuwj/15/

<标题> HTML 
<ul id="navbar">
    <li><a href="#home" id="nav-home">Home</a></li>
    <li><a href="#portfolio" id="nav-portfolio">Portfolio</a>
        <div class="portfolio-apps">
         <section id="website">
            <span class="button">AAAAAAAAAAAAAAAAAAAAAA</span>
         </section>
         <section id="gterminal">
            <span class="button">BBBBBBBBBBBBBBBBBBBBBB</span>
         </section>
         <section>
            <span class="button">CCCCCCCCCCCCCCCCCCCCCC</span>
         </section>
        </div>
    </li>
    <li><a href="#about" id="nav-about">About Me</a></li>
    <li><a href="#contact" id="nav-contact">Contact</a></li>
   </ul>
<标题> JS h1> div class="answers">

把你的Javascript改成这样:

$('#navbar > li > a').click(function(){
    portf_apps.hide();
});
$('#nav-portfolio').unbind('click').click(function() {
    portf_apps.show();
});

将另一个点击事件绑定到其他导航栏元素在显示一个事件的组合之前:

$("#navbar a").on('click', function () {
   $(".portfolio-apps").hide(); 
});
var portf_apps = $('.portfolio-apps');
...

这将导致portf_apps方法随后触发，即使它被单击也会显示它的子方法。不过，我建议将其更新为适用于一般的亲子关系。

http://jsfiddle.net/jWujm/

相关文章：