2013-08-10 9 views
19

jQueryの:first:visible擬似セレクターを使用して、リストの最初の可視要素を取得しようとすると最初に表示される要素を取得:https://stackoverflow.com/a/830611/165673をそれが働いていない:は、jQueryの

フィドル:http://jsfiddle.net/FAY9q/4/

HTML:

<ul> 
    <li>Item A</li> 
    <li>Item B</li> 
    <li>Item C</li> 
</ul> 
<ul> 
    <li style="display:none;">Item A</li> 
    <li>Item B</li> 
    <li>Item C</li> 
</ul> 

jQueryの:各リストの最初の項目は青に変わります

$('li:visible:first').css('background','blue'); 

...

+0

を、正常に動作しているようだ...それがあった場合は項目Aの背景はArun- @ –

+0

を変更しました最初のリストの項目Aの背景と2番目のリストの項目Bが変更されます – Yarin

答えて

40

はこれを使用してみてください:

$('ul').find('li:visible:first').css('background','blue'); 

現在、あなたのコードは、ちょうど上の最初の可視liの要素を取得していますページを開き、背景色を設定します。このコードでは、すべてul要素が選択され、最初にそれぞれliが表示され、スタイルが適用されます。

ここで働いている:この使用についてhttp://jsfiddle.net/FAY9q/5/

+0

@ Joe- Ugh、あなたは右のSLOPPYです! – Yarin

+0

奇妙なことに、 '$( 'ul li:visible:first')'を使ってもまだ動作しません:http://jsfiddle.net/FAY9q/7/( '$ '' ul ' .find( 'li:visible:first') ') – Yarin

+0

@ヤリン - それはまだ' ul'の中で最初の目に見える 'li'を探しているからでしょう。 '.find()'が動作するのは、一致した要素(この場合は 'ul's)の_each_内の指定されたセレクタを見つけることです。 – Joe

-2
$('li:visible').eq(0).css('background','blue'); 
+0

これは動作しません:http://jsfiddle.net/FAY9q/8/ – Yarin

+0

ありがとうございました。それは私の間違いだった、私は見つけることを置かなかった。 – Lab

0

何:

li:visible:not(:visible ~ :visible)