jquery - 如何使用 jQuery 正确迭代 的列表项？

Question

我有以下<ul> :

<ul>
     <li class='test selected'></li>
     <li class='test'></li>
     <li class='test'></li>
     <li class='test'></li>
     <li>separator</li>
     <li class='test'></li>
     <li class='test'></li>
     <li class='test'></li>
</ul>

我能够选择第一个元素并迭代<li>在通过 jquery 的分隔符之前，如下所示:

li = $('.selected'); //currently selected <li>
if ($(li).next('.test').length) {
     $(li).removeClass('selected');
     $(li).next('.test').addClass('selected');
} 

这一切工作正常，直到我到达分隔符(换句话说，一个没有“.test”类的 <li> )。在到达第一个分隔符时，我需要知道如何查看下一个“.test”。

如果有帮助的话，li是动态生成的。另外，我将在 keydown() 上触发此事件。

有什么想法吗？建议？

Answer 1

将 .next('.test') 更改为 .nextAll('.test').first()

next() 只查看下一个同级，而 nextAll()搜索所有 future 的 sibling 。