#### 当我点击的时候当前点击菜单展开，其他菜单收缩，并配上效果 HTML ~~~ <div id="nav"> <ul> <li> <div class="nav-item"> <i class="iconfont will-jinxiaocun"></i> <span>出品物料</span> </div> <div class="menu"> <ul> <li><a class="menuItem" href="javascript:void();">单位</a></li> <li><a class="menuItem" href="javascript:void();">做法管理</a></li> <li><a class="menuItem" href="javascript:void();">出品类别</a></li> <li><a class="menuItem" href="javascript:void();">出品档案</a></li> </ul> </div> </li> <li> <div class="nav-item"> <i class="iconfont will-kucun"></i> <span>库存管理</span> </div> <div class="menu"> <ul> <li><a class="menuItem" href="javascript:void();">收银订单</a></li> </ul> </div> </li> <ul> </div> ~~~ CSS样式 ~~~ .menu { dsiplay: none } ~~~ Jquery很简单的一句话 ~~~ // 左侧菜单的点击展开，其他收缩回去 $("#nav .nav-item").click(function(){ $(this).next("div.menu").slideDown(300).parents("li").siblings("li").find("div.menu").slideUp(300); }); ~~~