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