jquery - jquery 来选择它的孩子 1 一个接一个？

Question

这是我的html代码：

<ul id="menuDots">
    <li id="about1"><a href="#"><img class="bulletRoll" src="images/menu-dot.png" /><img src="images/menu-dot-rollover.png" /></a></li>
    <li id="about2"><a href="#"><img class="bulletRoll" src="images/menu-dot.png" /><img src="images/menu-dot-rollover.png" /></a></li>
    <li id="about3"><a href="#"><img class="bulletRoll" src="images/menu-dot.png" /><img src="images/menu-dot-rollover.png" /></a></li>
</ul>

现在我正在标记bulletRoll 类，是否有一个jquery 函数然后可以选择bulletRoll 1 一个接一个？假设我在第二个 bulletRoll 课程上，然后我再次触发相同的功能，它将转到最近的上一个/下一个 bulletRoll 课程？

谢谢您的帮助。

Answer 1

看看 jQuery 的.next()和.prev()函数。

var current = $("li:first");
if(current.next().length){ //for next. If next exists,
   current = current.next():
   trigger_function(current);
}
if(current.prev().length){ //Similarly for prev,
   current = current.prev():
   trigger_function(current);
}

Answer 2

您可以使用jQuery 的 next和/或prev选择器来执行此操作。

例如

var next = $(this).next("li");
if (next.length){   // there is another li
   myfunction(next);  //trigger same function
}

对于您的用例，使用jQuery 的 each 函数可能会更简单，因为它将遍历您选择中的每个元素，而不必递归调用函数：

$("li").each(function(index, value){
   // do something with the element $(this)
});