Jquery：在多於一個div中的每個元素的集合

我正在製作一個Jquery幻燈片。它列出縮略圖，當點擊時，將大圖像顯示爲覆蓋圖。爲了將大拇指與大圖像匹配，我將屬性添加到每個縮略圖和大圖像。這些屬性包含一個數字，它將每個拇指與其對應的大圖像進行匹配。當一個幻燈片出現在頁面上時，它可以工作。但是如果存在多個幻燈片，我希望它能夠工作。Jquery：在多於一個div中的每個元素的集合

下面是添加屬性，以拇指和大型圖像的代碼：

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

這樣做的問題是，incrimenting操作不會重置第二幻燈片div（.slideshow），所以我最終在第一個.slideshow div被編號爲1,2,3等大拇指。第二個.slideshow div被編號爲4,5,6等拇指。第二個.slideshow div中的數字重置並從1開始？

這真的很難簡明扼要地解釋。我希望有人得到這個要點。

來源

2010-03-17 Jack

在你的每一個下井的水平，確保它的作用域爲每個幻燈片這樣的：

$('.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塊內，並在其內部循環，而不是整體，然後將其設置循環遍歷所有的塊。

來源

2010-03-17 13:04:44

Jquery：在多於一個div中的每個元素的集合

回答

相關問題