2010-07-15 49 views
1

我有下面的代碼位在頁面上顯示縮略圖:計數孩子的DIV +添加

<div id="gallery"> <div class="thumbnail"> <img src="" /> </div> </div>

這將循環顯示15 .thumbnail資料覈實。

我想給第5個DIV和第10個DIV添加一個「.last」類。而第十一至第十五個DIV則是一類「.bottom-last」。

我明白,這是要走的路:http://api.jquery.com/length/但無法找到一種方法來獲得計數,然後附加類。

任何指針?

非常感謝

回答

4

如果您不介意語法,以下是一種方法。 (當然,你可以很容易地使用傳統的if()聲明以及)

試試看:http://jsfiddle.net/bBgTs/1/

$('#gallery .thumbnail').addClass(function(i) { 
    return ((i == 4 || i == 9) && 'last') || (i > 9 && 'bottom-last'); 
}); 
+1

我喜歡這個版本! – choise 2010-07-15 15:03:52

+0

+1,我也喜歡這個(加上我用'或'而不是'''在我的,只看到它,而看着你的答案) – 2010-07-15 15:09:03

+1

@Gaby - 我甚至沒有注意到你有'或' ! :o)如果你正在做小修改,你有'addclass'而不是'addClass'。我想OP會得到總體的觀點。 :o) – user113716 2010-07-15 15:11:25

4

使用每一個經過該指數作爲參數的方法..

$('#gallery .thumbnail').each(function(idx){ 
if (idx==4 || idx==9) 
    $(this).addClass('last'); 
if (idx > 9) 
    $(this).addClass('bottom-last'); 
}); 

注數是1減去你想要的,因爲該指數是什麼從零開始

+1

僅供參考,應IDX == 10而不是1個 – ScottS 2010-07-15 14:48:02

+0

@scott,它應該是9,因爲它基於零,但你是正確的。我在我的答案中弄亂了數字..更新了。謝謝。 – 2010-07-15 14:50:13

+0

哦,是的,當然:-) – ScottS 2010-07-15 15:05:40

2
$(".thumbnail:eq(4), .thumbnail:eq(9)").addClass("last"); 
$(".thumbnail:gt(9)").addClass("bottom-last"); 
+0

同樣,這工作得很好,非常感謝! – Dave 2010-07-15 15:35:56