jquery itérer à travers des éléments de la liste

Question

que vous avez cette html

<ul class="nav sub_nav_home"> 
    <li id="sub_nav_home1"><a href="#"><span>LINK1</span></a></li> 
    <li id="sub_nav_home2"><a href="#"><span>LINK2</span></a></li> 
    <li id="sub_nav_home3"><a href="#"><span>LINK3</span></a></li> 
</ul> 

comment voulez-vous itérer chaque « li » dans jquery ajouter une classe « en cours », en attendant pendant 3 secondes, puis passer à la suivante « li , et une fois que vous arrivez à la fin Recommençons

Merci

Answer 1

Une solution simple pourrait ressembler à ceci:

$(function() { 
    var nav = $("ul.sub_nav_home"); 
    setInterval(function() { 
    var next = nav.find("li.current + li, li:first-child").last(); 
    nav.find("li.current").removeClass("current"); 
    next.addClass("current"); 
    }, 3000); 
}); 

You can give it a try here. Vous pouvez réduire cela un peu plus, en essayant simplement d'exposer clairement ce qui se passe. Qu'est-ce que cela fait est exécuté la fonction exécutée toutes les 3 secondes, nous trouvons le <ul> dès le début pour mettre en cache les choses, puis à chaque exécution nous obtenons celui après le .current<li> (s'il y en a un) et le premier, au cas où nous sommes à la fin. Nous prenons le dernier de ceux-ci (puisqu'ils sont dans l'ordre des documents), donc nous préférons toujours le suivant au bouclage au début. Ensuite, supprimez simplement la classe de la classe actuelle et ajoutez-la à la ligne suivante.

Answer 2

vous pouvez utiliser chaque fonction

Answer 3

Je pense que vous en avez besoin ... jQuery('#nav sub_nav_home li').each()