Jquery: инкриминация для каждого набора элементов более чем в 1 div

Я делаю слайд-шоу Jquery. В нем перечислены миниатюры, при нажатии на которые открывается большое изображение в виде наложения. Чтобы сопоставить миниатюры с большими изображениями, я добавляю атрибуты к каждой миниатюре и большому изображению. Атрибуты содержат число, которое сопоставляет каждому миниатюре соответствующее большое изображение. Это работает, когда на странице присутствует одно слайд-шоу. Но я хочу, чтобы это работало, если присутствует более одного слайд-шоу.

Вот код для добавления атрибутов к миниатюрам и большим изображениям:

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

Это работает. Чтобы заставить работать приращение, когда на странице есть два слайд-шоу, я подумал, что могу вставить этот код в каждую функцию...

$('.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);
    });
});

Проблема с этим заключается в том, что инкриминирующий оператор не сбрасывается для второго div слайд-шоу (.slideshow), поэтому я получаю большие пальцы в первом div .slideshow с номерами 1,2,3 и т. д. и большие пальцы во втором. div слайд-шоу пронумерован 4,5,6 и т. д. Как сделать, чтобы числа во втором .slideshow div сбрасывались и снова начинались с 1?

Это действительно трудно объяснить кратко. Я надеюсь, что кто-то понял суть.


jquery each auto-increment
person Jack    schedule 17.03.2010    source источник

Ответы (1)


arrow_upward
1
arrow_downward

В каждом из них перейдите на уровень ниже, убедитесь, что он ограничен каждым слайд-шоу следующим образом:

$('.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++);
    });
});

Это устанавливает их в 0 внутри каждого блока .slideshow_content и зацикливает внутри него вместо того, чтобы устанавливать его в целом, а затем зацикливать все блоки.

person Nick Craver    schedule 17.03.2010