Question

我有一个ul，我想保持开放，而其他人可以切换。加载页面时，html如下所示：https://jsfiddle.net/q9munmab/

<div class="leftNav">
   <ul>
       <li>
           <div class="active">Test</div>
           <ul class="navtoggle nonactive">
              <li><a></a></li>
              <li><a></a></li>
              <li><a class="current"></a></li>
           </ul>
           <div>Test 1</div>
           <ul class="navtoggle nonactive">
              <li><a></a></li>
              <li><a></a></li>
              <li><a></a></li>
           </ul>
           <div>Test 2</div>
           <ul class="navtoggle nonactive">
              <li><a></a></li>
              <li><a></a></li>
              <li><a></a></li>
           </ul>
       </li>
   </ul>
</div>

Class＆＃34; active＆＃34;取决于您点击的3个链接中的哪个，而班级＆＃34;当前＆＃34;是您实际访问的页面。我已经尝试了多种切换方式，但似乎无法弄清楚如何保持哪一种（div class＆＃34; active＆＃34;以及ul切换实体），而你可以在另一种之间切换二。然后，当您单击li a时，页面将再次加载并重新开始。

 $('.navContainer li div').click(function () {
   var $t = $(this);
   var $next = $t.next('.navtoggle');
   var $back = $('.current:visible').closest('ul').prev();
   $(this).not('.leftNav li div.active').toggleClass('nonactive');
   $('.navtoggle').not($back).slideToggle();
 });

Answer 1

工作小提琴：https://jsfiddle.net/q9munmab/3/

根据我的信息，这可能适合您。 setNewValue(stuff.getValue().getWhatever())选择器的解决方案很简单。这是你如何使用它。

not

更新（隐藏其他UL＆＃39;

）

工作小提琴：https://jsfiddle.net/q9munmab/5/

另外添加了$(".navContainer ul>li>div:not(.active)").click(function() { $(this).next().slideToggle(); });

使用兄弟姐妹来瞄准其他UL，以便隐藏。

更新（当您说，点击其他div时，活动UL没有任何反应）

工作小提琴：https://jsfiddle.net/q9munmab/7/

$(this).next().slideToggle().siblings("ul").hide();

在加载时添加了额外的类，这只会影响活动div的UL，并再次使用$(".navContainer ul>li>div.active").next().show().addClass("no-effect"); $(".navContainer ul>li>div:not(.active)").click(function() { $(this).next().slideToggle().siblings("ul:not(.no-effect)").hide(); });选择器来避免Active Div和UL上的活动。

如何在其他ul切换时保持ul打开

1 个答案: