jQuery( ':hidden' )

jQuery API の jQuery( ':hidden' ) は、非表示になっているすべての要素を選択する。type 属性が hidden である input 要素も、選択対象となる。

記述方法

jQuery( 'セレクター:hidden' )

セレクターに一致した要素のうち、非表示になっているすべての要素を選択する。

実装例(サンプル)

  • 項目1
    • 項目1-1
    • 項目1-2
  • 項目2
    • 項目2-1
    • 項目2-2
      • 項目2-2-1
      • 項目2-2-2
    • 項目2-3
  • 項目3

実装例(サンプル)の動作について

「表示」ボタンをクリックすると、入れ子になっているリスト要素を表示する。

実装例(サンプル)のソースコード

JavaScript

<script type="text/javascript">
<!--
jQuery( function() {
    jQuery( '#jquery-api-click' ) . click( function () {
        jQuery( '#jquery-api-hidden ul:hidden' ) . show();
    } );
} );
// -->
</script>

CSS

<style>
<!--
#jquery-api-hidden ul {
    display: none;
}
-->
</style>

HTML

<button id="jquery-api-click">表示</button>
<ul id="jquery-api-hidden">
    <li>項目1
        <ul>
            <li>項目1-1</li>
            <li>項目1-2</li>
        </ul>
    </li>
    <li>項目2
        <ul>
            <li>項目2-1</li>
            <li>項目2-2
                <ul>
                    <li>項目2-2-1</li>
                    <li>項目2-2-2</li>
                </ul>
            </li>
            <li>項目2-3</li>
        </ul>
    </li>
    <li>項目3</li>
</ul>

スポンサード リンク

カテゴリー: API, JavaScript, jQuery, セレクター, フォーム, 可視フィルタ タグ: パーマリンク