在jQuery中一起使用:visible和:first-child [英] Using :visible and :first-child together in jQuery

问题描述

我正在尝试在jQuery中同时使用:visible"和:first-child"伪选择器，但似乎没有奏效.我有以下HTML:

I'm trying to use the ":visible" and ":first-child" pseudo-selectors together in jQuery and it doesn't seem to be working out. I have the following 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调用:

And the following jQuery call:

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

但是似乎永远找不到合适的元素...它找到第一个元素，但找不到第一个 visible 元素.我什至尝试将选择器顺序:first-child:visible"替换为:visible:first-child"，但这也不起作用.有什么想法吗?

But it never seems to find the right element...it finds the first element but not the first visible element. I've even tried swapping the selector order ":first-child:visible" instead of ":visible:first-child" and that doesn't work either. Any ideas?

推荐答案

您的选择器

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

仅当 A 元素是父DIV的第一个子元素且可见时才匹配.

matches only the A element only when it's the first-child of the parent DIV and when it is visible.

如果要获取第一个可见的 A 元素，则应使用

If you want to get the first visible A element, you should use the .eq function

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

或:first伪类

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

这篇关于在jQuery中一起使用:visible和:first-child的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！