使用jQuery返回筛选列表中的下一个列表项

Question

我有以下列表

<ul>
  <li id="item1">Item 1</li>
  <li id="item2">Item 2</li>
  <li>Item 3</li>
  <li id="item4">Item 4</li>
</ul>

使用jQuery，我试图遍历其ID以“item”开头的LI列表。

var nextItemWithItemID = $("#item2").next("li[id^='item']);

但是，当我运行此代码时，我最终会检索“第3项”而不是“第4项”。

如何让jQuery从过滤的LI列表中获取正确的下一项？

Answer 1

您想使用nextAll（）。接下来只是在当前元素之后立即检索兄弟。 NextAll（）将考虑以下所有兄弟姐妹。

var nextItemWithItemID = $('#item2').nextAll('li[id^=item]:first');

Answer 2

昨晚我遇到了这个问题。虽然@tvanfosson提供了一种方法来获取所有后续兄弟姐妹，但如果您希望下一个项目符合该条件，我想出了以下解决方案（适用于您的示例）：

var nextItemWithItemID = $("#item2").nextUntil("li[id^='item']").andSelf().next();

就是这样。使用nextUntil()抓取所有直到该术语，但不包括该术语，因此您必须使用next()。但是如果返回的集合为空（如果您的初始选择器与下一个与您的查询匹配的内容之间没有任何内容），那将无效 - andSelf()解决了这个问题。