jQuery的n個子當前可見

Question

我可以風格每4個「項目」 DIV像這樣

jQuery(".item:nth-child(4n)").addClass("fourth-item"); 

和工作正常，但後來我隱藏某些項目，顯示出一些人，想重新做這個造型，但只是造型每一個可見的第四個項目。所以我有一個函數可以刪除這個樣式並重新應用它，但是我需要在重新應用樣式時指定它只是每個第4個可見項，而不是每個第4個項。我知道「：可見」選擇器，但無法正確地將它與第n個子選擇器鏈接起來，有什麼想法？

我已經嘗試了各種這樣的事情都無濟於事......

jQuery(".item").removeClass("fourth-item"); 
jQuery(".item:visible:nth-child(4n)").addClass("fourth-item"); 

Answer 1

:nth-child掃描父母的孩子，不管他們的風格是什麼。 :nth-child中的計數相對於父元素而不是前一個選擇器。這是在jQuery的文檔解釋了:nth-child：

隨着:nth-child(n)，所有兒童都計算在內，不管它們是什麼，以及指定的元素被選中，只有當它連接到僞類選擇相匹配。

使用更簡單的方法，用each不正是你想要什麼：

$('#test li:visible').each(function (i) { 
    if (i % 4 == 0) $(this).addClass('fourth-item'); 
});