如果li处于活动状态,则显示隐藏的ul

时间:2017-02-10 作者:joelybristol

我已成功使用模板页面中的for each将类“active”添加到当前页面项。

我想做的是使用jQuery(或者css3,如果有人有任何想法的话)显示当前li的ul,无论它是活动的还是单击另一个div。

这是我的HTML输出

<div id="menu">
 <div class="trigger"> show or hide it </div>
   <ul class="things">
     <li> item 1 </li>
     <li class="active"> item 2 </li>
     <li> item 3 </li>
   </ul>

 <div class="trigger"> show or hide it </div>
   <ul class="things">
     <li> item 4 </li>
     <li> item 5 </li>
     <li> item 6 </li>
   </ul>
</div>
因此,我希望使用jQuery仅在触发器被单击或包含活动li且两个选项同时可用时显示ul。因此,默认情况下显示它有一个活动的li,但也可以通过单击触发器来隐藏它。

2 个回复
最合适的回答,由SO网友:Bill 整理而成

您可以通过一个简单的JQuery选择器来实现这一点。

$($(\'.active\').parent(\'ul\').get(0)).css(\'display\', \'none\');
我们正在选择查找活动类的父UL,并通过css隐藏元素。

https://jsfiddle.net/0voxj6fp/

SO网友:Rami Salim

请参见我在html中添加的一些内容

<title>fghgfhgfh</title>
<link href="css/ans.css" type="text/css" rel="stylesheet"/>


</head>
<body>
<div id="menu">
    <div class="trigger"><button> show or hide it </button></div>
第1项第2项第3项

    <div class="trigger"> <button> show or hide it</button> </div>
第4项第5项第6项

</body>
这是jequrey src(文档)。就绪(function(){$(“button”)。单击(function(){$(“li”)。切换();

});});