在jQuery中使用：visible和：first-child

Question

我試圖在jQuery中一起使用「：visible」和「：first-child」僞選擇器，它看起來似乎沒有工作。我有以下HTML：

<div> 
    <a class="action" style="display:none;">Item One</a> 
    <a class="action">Item One</a> 
    <a class="action">Item One</a> 
</div> 

而下面的jQuery的電話：

$("div a.action:visible:first-child").addClass("first"); 

但它似乎從來沒有找到合適的元素...它找到的第一個元素，但不是第一可見元件。我甚至嘗試交換選擇器順序「：first-child：visible」而不是「：visible：first-child」，這也不起作用。有任何想法嗎？

Answer 1

你的選擇只有

$("div a.action:visible:first-child").addClass("first"); 

比賽的只有當它的父DIV的第一個孩子，當它是可見元素。

如果你想獲得第一個可見一個元素，你應該使用.eq function

$("div a.action:visible").eq(0).addClass("first"); 

或:first pseudo-class

$("div a.action:visible:first").addClass("first"); 

Answer 2

我不知道爲什麼:visible:first-child不工作，但你可以嘗試

$("div a.action:visible").eq(0).addClass("first"); 

Answer 3

據我所知道的僞類選擇：第一，孩子只能將永遠匹配的第一個孩子。不能通過添加一個僞類來進一步指定它，它也必須是可見的。您可能想嘗試編寫

$("div a.action:visible:first").addClass("first"); 

而不是使用正確的css僞類。 JQuery documentation for :first

Answer 4

你可能想嘗試$("div a.action:visible(:first-child))爲您的選擇，那是jQuery如何在其API文檔中使用多個僞選擇器指定的。