2012-04-02 17 views
1

私はここでHTMLjQueryの:複数の属性に基づいて要素の選択

<tr id="r1" class="l1"> 
       <td><img class="plusminus" id="r1c1" src="assets/images/plus.png" border="0" />3/10/12</td> 
       <td></td> 
       <td></td> 
       <td>4,449,371</td> 
       <td>27,399</td> 
       <td>$500,000</td> 
       <td>8.91%</td> 
       <td>0.68%</td> 
       <td>0.62%</td> 
       <td>$0.04</td> 
       <td>791</td> 
       <td>2.8%</td> 
       <td>$1.39</td> 
      </tr> 
      <tr id="r11" class="l2"> 
       <td></td> 
       <td></td> 
       <td>iPad Winner</td> 
       <td>700,302</td> 
       <td>2,472</td> 
       <td>98.88</td> 
       <td>8.07%</td> 
       <td>0.68%</td> 
       <td>0.62%</td> 
       <td>$0.04</td> 
       <td>791</td> 
       <td>2.8%</td> 
       <td>$1.39</td> 
      </tr> 
      <tr id="r12" class="l2"> 
       <td></td> 
       <td></td> 
       <td>iPad Winner2</td> 
       <td>300,302</td> 
       <td>2,472</td> 
       <td>98.88</td> 
       <td>8.07%</td> 
       <td>0.68%</td> 
       <td>0.62%</td> 
       <td>$0.04</td> 
       <td>791</td> 
       <td>2.8%</td> 
       <td>$1.39</td> 
      </tr> 

     <tr id="r2" class="l1"> 
       <td><img class="plusminus" id="r2c1" src="assets/images/plus.png" border="0" />4/10/12</td> 
       <td></td> 
       <td></td> 
       <td>4,4555,55</td> 
       <td>27,399</td> 
       <td>$500,000</td> 
       <td>8.91%</td> 
       <td>0.68%</td> 
       <td>0.62%</td> 
       <td>$0.04</td> 
       <td>791</td> 
       <td>2.8%</td> 
       <td>$1.39</td> 
      </tr> 

<tr id="r21" class="l2"> 
       <td><img class="plusminus" id="r2c1" src="assets/images/plus.png" border="0" />4/10/12</td> 
       <td></td> 
       <td></td> 
       <td>4,4555,55</td> 
       <td>27,399</td> 
       <td>$500,000</td> 
       <td>8.91%</td> 
       <td>0.68%</td> 
       <td>0.62%</td> 
       <td>$0.04</td> 
       <td>791</td> 
       <td>2.8%</td> 
       <td>$1.39</td> 
      </tr> 

を以下しているR1R11は、* R12 *子行している間、親が子供ながらクラス李を持っている親の行でありますl2を有する。私はIDパターンに一致し、クラス= L2を持っているに基づいてフィルタリングされた結果を必要とするすべてのsubsquent IdsはR1と一緒にいるのid = R1のクリックイベントに次のjQueryを使用して、クラスL2

var pattern = 'r1';//just for example here 
$('tr[id|="'+pattern+'"][class=l2]') 

を持っています。どうすればこれを達成できますか? 「 - 」が続くプレフィックスに一致する|「=」を使用しているので、あなたのセレクタは動作しません

var pattern = 'r1';//just for example here 
$('tr[id^="'+pattern+'"][class=l2]') 

:アドバンス

+1

私によく見えます。あなたはそれに何か問題がありますか? 'l2'を二重引用符で囲むこともできます。あるいは、クラスセレクタ '$( 'tr.l2 [...]')'を使うだけです。 –

答えて

2

EDIT

おかげでこれはトリックを行う必要があります。そのため、子ローの命名規則がr1-1、r1-2の場合、セレクタは正常だったはずです。指定された文字列で始まる属性を選択する '^ ='を使用する必要があります。個人的に

私がなり、代わりに子行のIDを持つのは、単純に子行上のクラスとして親IDを指定する - これは物事が少し簡単になりますので、IDのすべての子= r1がこの

<tr id="r1" class="l1"><td>I am a parent row</td></tr> 
<tr class="l2 r1"><td>I am a child row of r1</td></tr> 
ようになります。ユーザーが親行をクリックしたときに

はそう子行を選択するために、私はこの

$(".l1").click(function(){ 
var sel = $(this).attr("id"); 
var children = $("table").find("." + sel) 

}) 

を行うだろうが、これは個人的な好みの問題です。

+0

私は最初の行では** l2 r1 **、二番目には** l2 r2 **のように、各レベルで複数のクラスを取りに行きました。あなたの実装が本当に好きでした。将来的に役立つだろう – Volatil3

0
$('id|=["' + pattern + '"] > .l2') 

意味:私パターン

編集接頭辞idを持つ親のクラス.l2持つすべての子を与える:申し訳ありませんが、あなたは接頭辞、更新されたコードを探していた気づきました。

関連する問題