jquery选择它的孩子一个又一个？

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> 

现在我tagerting bulletRoll类，是有一个jQuery函数，那么可以陆续选择bulletRoll 1？比方说，如果我在第二个bulletRoll类，然后我再次触发相同的函数，它会去最近的前一个/下一个bulletRoll类？

感谢您的帮助。

Answer 1

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

E.g.

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

为您的使用情况下，它可能是简单的使用jQuery's each function不过，因为它会通过您选择的每个元素进行迭代，而无需调用递归函数：

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

Answer 2

对.next()一看.prev() jQuery的功能。

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); 
}