我一直在寻找解决方案,但我无法弄清楚如何。
我想要的是被点击的唯一标题是唯一展开的标题。
演示在这里:http://jsfiddle.net/bm92L0eg/1/
HTML:
<h3 class="click-list">header a</h3>
<ul class="open-list">
<li>item</li>
<li>item</li>
<li>item</li>
</ul>
<h3 class="click-list">header b</h3>
<ul class="open-list">
<li>item</li>
<li>item</li>
<li>item</li>
</ul>
<h3 class="click-list">header c</h3>
<ul class="open-list">
<li>item</li>
<li>item</li>
<li>item</li>
</ul>
jquery的:
$('.click-list').click(function() {
$(this).find('.open-list').slideToggle(600);
});
jquery代码没有工作,而下面这段代码是一个可以激活所有标题的代码:
$('.open-list').slideToggle(600);
答案 0 :(得分:3)
使用.next()
选择相邻的.open-list
元素。
应该是:
$('.click-list').click(function () {
$(this).next('.open-list').slideToggle(600);
});