【11】jQuery学習——入門jQueryセレクタのフィルタセレクタ-フォームオブジェクト属性フィルタセレクタ

2552 ワード

ps.以下内容転載夢三秋サイト
今日では、jQueryフィルタセレクタの最後のフォームオブジェクトプロパティフィルタセレクタについて説明します.このセレクタは、使用できないフォーム要素の選択、選択されたドロップダウン・ボックス、複数選択ボックスなど、主に選択されたフォーム要素をフィルタします.フォーム・オブジェクトのプロパティ・フィルタ・セレクタの説明を次の表に示します.
セレクタ
説明
戻る

:enabled
使用可能なすべてのフォーム要素の選択
集合要素
$(#form 1:enabled)idが「form 1」のフォーム内のすべての使用可能な要素を選択
:disabled
使用できないすべてのフォーム要素を選択
集合要素
$(#form 2:disabled)idが「form 2」のフォーム内の使用できない要素をすべて選択
:checked
選択したすべての要素を選択します(ラジオボックス-radio、チェックボックス-checkbox)
集合要素
$(「input:checked」)選択したすべての要素を選択
:selected
選択したすべてのオプション要素を選択(ドロップダウンリスト)
集合要素
$(「select:selected」)選択したすべてのオプション要素を選択(option)
上の表の説明には、$(「#form 2:disabled」)と$(「#input:checked」)の2つのコードがあります.1つ目はjQueryセレクタにスペースが付いているもので、2つ目はスペースが付いていないもので、この2つの違いは何ですか?では、スペースによる「血液事件」を見てみましょう.
まず、次のHTMLコードを構築します.
<div class="test">

<div style="display:none;">Jquery  </div>

<div style="display:none;">Jquery  </div>

<div style="display:none;">Jquery  </div>

<div class="test" style="display:none;">PHP  </div>

</div>

<div class="test" style="display:none;">Jquery    </div>

<div class="test" style="display:none;">Jquery    </div>


jQueryコード:
var $test_a = $(".test :hidden");//    jQuery   

var $test_b = $(".test:hidden");//     jQuery   

var len_a = $test_a.length;

var len_b = $test_b.length;

alert("    jQuery      jQuery   :"+len_a+" ");//   4 

alert("     jQuery      jQuery   :"+len_b+" ");//   3 


結果が異なるのは、階層(子孫)セレクタとフィルタセレクタの違いです.
var $test_a = $(".test :hidden");//    jQuery   


上のコードはclassが「test」の要素の中の非表示要素を選択したものです.(階層セレクタ)
var $test_b = $(".test:hidden");//     jQuery   


この上のコードは、非表示のclassを「test」とする要素を選択します.
注意:あるセレクタの使用方法は、スペースでなければなりません.スペースを持たないと、要素が取れません.たとえば、次のようにします.
$("select:selected").length;//      ,           ,  length   0

$("select :selected");//       


あるセレクタの使い方は、スペースを持たない必要があります.スペースを持たないと、要素が取れません.たとえば、次のようなものです.
$("input :checked").length;//      ,           ,  length   0

$("input:checked");//