Question

我有一个触发器需要抓取下一个UL元素并对其应用效果。

 <div id="archives_trigger"><a class="menu_trigger">Monhtly Archives</a></div>
  <ul id="archives_menu">
   <?php wp_get_archives(); ?>
  </ul>
 </div>

在这种情况下，锚menu_trigger用作选择器。我正在使用以下内容，但有些不对劲。我假设我没有正确使用next选择器。

 $('a.menu_trigger').click(
  function () {
    $(this).next(ul).stop(true,true).slideToggle().toggleClass('active');
   }
  );

您能否指出我如何正确使用next选择器？

[编辑]感谢您编辑错误的标记。非常感谢。

Answer 1

您正在寻找a元素的下一个兄弟（next()返回下一个兄弟元素，如果没有兄弟姐妹，则返回空选）。 ul是div#archives_trigger的兄弟姐妹。因此，您需要先致电parent()：

$(this).parent().next('ul').stop(true,true).slideToggle().toggleClass('active');

Answer 2

我不知道那是否是一个错字，但你想尝试

$(this).next('ul')

而不是

$(this).next(ul)

Answer 3

next仅适用于当前元素的范围。你将它放入<div>，因此它没有任何下一个元素。

您必须将自己定位在父级上，然后找到下一个ul元素：

$('a.menu_trigger').click(
    function () {
        $(this).parent().nextAll('ul:first').stop(true,true).slideToggle().toggleClass('active');
    }
);

检查next和nextAll之间的区别。如果您使用next("ul")并且第一个下一个元素不是<ul>，则您将找不到任何元素。另一方面，如果您将nextAll与ul一起使用，则会获得所有下一个ul，因此您需要ul组中的第一个。{{1}}。

祝你好运！

Answer 4

.next()获得下一个兄弟姐妹。 archives_menu是archives_trigger的兄弟，而不是menu_trigger。

UL有ID，为什么不使用它？ $('#archives_menu')

编辑：阅读Jonathon Bolster的评论。 </div>应该在哪里？你有一个开放的div标签，但有2个结束标签。如果您在</div>之后移除menu_trigger，则ul将成为a的兄弟。

编辑2：您需要在jQuery选择器周围引用。

Answer 5

UL不是您标记中的下一个兄弟。它是触发器父级的下一个兄弟。所以你可以尝试：

 $(this).parent().next("ul").....

选择下一个UL？

5 个答案: