Jquery: Incrimentation pour chaque ensemble d'éléments dans plus d'une div

Question

Je fais un diaporama Jquery. Il répertorie les vignettes, que lorsque vous cliquez dessus sur, révèle la grande image en surimpression. Pour faire correspondre les pouces avec les grandes images que je suis l'ajout d'attributs à chaque vignette et une grande image. Les attributs contiennent un nombre qui correspond à chaque pouce à son image de grande correspondante. Il fonctionne quand un diaporama est présent sur une page. Mais je veux que cela fonctionne si plus d'un diaporama est présent.

Voici le code pour ajouter des attributs aux pouces et de grandes images:

thumbNo = 0;
largeNo = 0;
$('.slideshow_content .thumbs img').each(function() {            
   thumbNo++;
   $(this).attr('thumbimage', thumbNo);
   $(this).attr("title", "Enter image gallery");
});
$('.slideshow_content .image_container .holder img').each(function() {   
   largeNo++;
   $(this).addClass('largeImage' + largeNo);
});

Cela fonctionne. Pour faire le travail d'incrémentation quand il y a deux diaporamas sur une page, je pensais que je pouvais tenir ce code dans une chaque fonction ...

$('.slideshow').each(function() {
    thumbNo = 0;
    largeNo = 0;
    $(this + '.slideshow_content .thumbs img').each(function() {            
       thumbNo++;
       $(this).attr('thumbimage', thumbNo);
       $(this).attr("title", "Enter image gallery");
    });
    $(this + '.slideshow_content .image_container .holder img').each(function() {   
       largeNo++;
       $(this).addClass('largeImage' + largeNo);
    });
});

Le problème est que l'opérateur incrimenting ne réinitialise pas pour la deuxième div diaporama (de .slideshow), donc je finis avec les pouces dans la première .slideshow div étant numéroté 1,2,3 etc .. et les pouces en la deuxième .slideshow div étant numéroté 4,5,6, etc. Comment puis-je faire les chiffres dans la deuxième div .slideshow remise à zéro et recommencer à nouveau 1?

Ceci est vraiment difficile à expliquer de façon concise. J'espère que quelqu'un obtient l'essentiel.

Answer 1

Dans votre chacun, descendez un niveau, assurez-vous qu'il est scope à chaque diaporama comme ceci:

$('.slideshow_content').each(function() {
    thumbNo = 0;
    largeNo = 0;
    $(this).find('.thumbs img').each(function() {
       $(this).attr('thumbimage', thumbNo++);
       $(this).attr("title", "Enter image gallery");
    });
    $(this).find('.image_container .holder img').each(function() {   
       $(this).addClass('largeImage' + largeNo++);
    });
});

Ce qui les met à 0 l'intérieur de chaque bloc .slideshow_content et boucle à l'intérieur au lieu de le mettre en boucle l'ensemble, puis à travers tous les blocs.