Question

切换不适用于子类（.open），它适用于主标记（li）。

$('.open').click(function() {
    $(this).next('ul').toggle();
});

我遗失了什么？

jsfiddle

Answer 1

<强> Updated fiddle

jQuery方法 next() 立即得到兄弟姐妹。

问题：您.open元素没有ul兄弟。

建议的解决方案：转到父li，然后使用.next()兄弟的ul，如：

$(this).parent().next('ul').toggle();
//Or
$(this).parents('li').next('ul').toggle();

希望这有帮助。

$('.open').click(function() {
   $(this).parent().next('ul').toggle();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li> 11111111 <i class="open">open</i></li>
  <ul>
    <li> 1.1 </li>
    <li> 1.2 </li>
  </ul>
  <li> 22222222222 <i class="open">open</i></li>
  <ul>
    <li> 2.1 </li>
    <li> 2.2 </li>
  </ul>
</ul>

Answer 2

使用.closest()获取neareast最近元素li .next()以获取dom中的select immediate ul元素

$('.open').click(function() {
    $(this).closest('li').next('ul').toggle();
});

Fiddle

Answer 3

获取li的父.open元素，然后获取该partent项的下一个li元素。

$('.open').click(function() {
    $(this).parent('li').next('ul').toggle();
});

Answer 4

当你将$(this).next('ul').toggle();的目标放在.open对象所在的<li>内的下一个ul时，但那里没有<ul>。

为此，您应该使用目标父<li>，然后定位其后的<ul>。

代码应该是这样的：

$('.open').click(function() {
    $(this).parent().next('ul').toggle();
});

使用子类切换列表

4 个答案: