2012-05-02 5 views
0

jqueryフィルタメソッドを機能させることに問題があります。jqueryフィルタセレクタとフィルタメソッド

I、代替行クラスを与えられている表を含むDIV「resultDiv」内の行の

$("#resultDiv tr:odd").addClass("alternate_row"); 

すべてを持っている場合。

しかし、私は

$('#resultDiv').filter("tr:odd").addClass("alternate_row"); 

を使用する場合は任意の要素に一致するように表示されず、何も適用されるクラスを持っていません。

私は変数を渡すいくつかの他のことをしているので、私はフィルタメソッドを使用する必要があります。

私には何が欠けていますか?

+0

Zebraストライピングのようなスタイリングのためにクラスを追加しようとしていて、古いブラウザをサポートする必要がない場合は、CSS3のnth-childセレクタを調べることもできます。 –

+0

残念ながら私は古いブラウザをサポートする必要があります。なぜなら、私はこの方法を選択したからです。 –

答えて

4

$('#resultDiv').filter("tr:odd").addClass("alternate_row")

.filter()セットから非整合要素を削除し、そしてあなたの#resultDiv要素のいずれもtrされないので、フィルタが一致しません何でも

試してください:明示的新しい子孫ノード一致tr:oddセレクタ、または

すべて trの要素を見つけるために、単一のセレクタを使用しています
$('#resultDiv tr').filter(":odd").addClass("alternate_row"); 

を追加

$('#resultDiv').find("tr:odd").addClass("alternate_row"); 

、奇数のものだけを選択するには.filterを使用します。

+0

なぜ最初のセレクタが動作するのですか? –

+3

@DanielPowellさんのご質問はありますか?なぜなら最初のセレクタは子孫の 'tr'ノードを明示的に見つけるからです。 '。filter() 'は新しいノードを見つけませんが、現在一致しているセットのみを減らします。 – Alnitak

2

私は#resultDivはそう、私はあなたがこのほしいと思うすべての<tr>年代の親であることを推測しています:あなたはID #resultDivで要素を選択している第2のセレクタで

$('#resultDiv tr').filter(":odd").addClass("alternate_row"); 
5

をしてにフィルタを適用それ。しかし、それはたぶんコレクションではなく、ただのテーブルなのかもしれません。

tr要素を選択し、このようなフィルタを適用する必要があります。

$('#resultDiv tr').filter(":odd").addClass("alternate_row"); 

このようにして、フィルタを適用するためのtrコレクションがあります。最初のバージョンでは

関連する問題