jquery nième sélection et setInterval

Question

Salut à tous. Au fond, je veux que l'image suivante à cliquer en utilisant jquery chaque seconde:

jQuery:

 var i=1;

 setInterval(function() {
  $(".portfolio :nth-child("+i+")").click();
  if (i<5) {i++;} else {i=1;}

 }, 1000);

HTML:

<div class="portfolio"> 
  <ul> 
   <li><img src="images/4.jpg" alt="4" id="promo_one"></li> 
   <li><img src="images/1.jpg" alt="1" id="promo_two"></li> 
   <li><img src="images/2.jpg" alt="2" id="promo_three"></li> 
   <li><img src="images/3.jpg" alt="3" id="promo_four"></li> 
  </ul> 
 </div> 

Merci à l'avance:)

Answer 1

Au lieu de :nth-child() vous pouvez utiliser .eq() ici, comme ceci:

var i=1;
setInterval(function() {
  $(".portfolio ul li img").eq(i).click();
  i = i==3 ? 0 : i + 1;
}, 1000);

Votre sélection devrait également descendre à la <img> (ou quitter la partie img si vous voulez cliquer sur le <li>), sinon vous cliquez sur d'autres éléments. Cela obtient toutes les images, et saisit l'un à l'index que vous voulez en utilisant .eq(index) de sorte que vous pouvez .click() il.

Answer 2

Je pense que votre sélecteur doit être:

$(".portfolio > ul > li:nth-child("+i+")").click();

... par exemple., Vous cherchez nième li qui est un enfant d'un ul qui est un enfant d'un .portfolio. Ce sont des sélecteurs enfants. Vous pouvez probablement utiliser un sélecteur descendant à la place, mais je pense (supposition) que sélecteurs enfants seront un peu plus efficace car ils ont moins de recherche à faire. (Bien sûr, ils seront aussi plus fragile, si vous changez votre structure.)

Voir aussi points de patrick sur votre i<4 comparision, il est probablement off par un.

Answer 3

Je pense que vous voulez vérifier si i est inférieur à 4 puisque vous avez 4 liens.

if (i<4) {i++;} else {i=1;}

Depuis :nth-child est un indice de 1 et 4 est inférieure à 5, quand vous arrivez à 4, il est incrément 5, mais il n'y a pas :nth-child(5).

Comme d'autres ont noté, vous voulez spécifier le :nth-child sur l'élément correct ainsi.

Exemple: http://jsfiddle.net/JBt6b/

Answer 4

var i=1;

setInterval(function(){
   $('.portfolio').find('img[alt=' + i + ']').trigger('click');
   if(i < 4) i++; else i=1;
}, 1000);

En regardant l'attribut ALT, cette tâche a une meilleure performance (comme beaucoup). N'a de sens que si l'attribut ALT est toujours présente bien sûr.

Answer 5

Modifier votre code javascript comme ceci:

var i=1;

setInterval(function() {
  $(".portfolio ul :nth-child("+i+")").click();

  if (i<5) {i++;} else {i=1;}

}, 1000);

Dans votre exemple .portfolio ne pas n enfants, il a 1.

Answer 6

Je pense que vous êtes proche (je ne sais pas exactement ce qui ne fonctionne pas), mais vous pouvez modifier votre sélection de:

".portfolio :nth-child("+i+")"

à:

".portfolio ul li:nth-child("+i+")"

si vous êtes à la recherche pour sélectionner le nième élément li. Je ne sais pas quoi d'autre ne va pas avec le code, s'il vous plaît élargir votre question si cela ne résout pas votre problème.

Answer 7

Je précalculer beaucoup d'éléments et d'utiliser l'arithmétique modulaire pour tourner à travers les images.

var images = $('.portfolio img').;
var count = images.length;
var lastClicked = count - 1;

setInterval( function() {
    var next = ++lastClicked % count;
    images.eq(next).click();
}, 1000);