jQuery DOM navigation - チェックした後に次のラベルを表示するチェックボックス

Question

これは簡単なはずですが、私は本当に立ち往生しています。

私は、asp.netリピータで設定されたテーブル要素を持っています。私のユーザは、1つまたは複数のチェックボックスをチェックし、jQueryがそれらをループして、関連するラベルテキストを探します。私はこれを働かせましたが、テーブルの構成を変更しましたが、今は再び働かせるようには見えません。

マイHTML：

<table class="c _table"> 
    <asp:Repeater ID="rptData" runat="server"> 
    <HeaderTemplate> 
    <tr> 
     <th> 
      <asp:Image runat="server" CssClass="c_imgPlusMinus" ImageUrl="Images/plus.jpg" /> 
     </th> 
     <th> 
      <asp:CheckBox ID="chkConAll" runat="server"/>Select Data 
     </th>  
    </tr>  
    </HeaderTemplate> 
    <ItemTemplate> 
    <tr> 
     <td > 
     </td> 
     <td> 
      <asp:CheckBox runat="server" cssclass="cd_chk" /><asp:Label runat="server" Text='<%#Eval("DataName") %>' /> 
     </td> 
    </tr> 
    </ItemTemplate> 
    </asp:Repeater>     
</table> 

私のjQuery：

var wholeString= ''; 
$('.cd_chk :checkbox:checked').each(function() { 
    wholeString = $(this).next('label').text(); 

    (do some stuff with wholeString) 

}); 

しかし、私は時間以上これで周りmonkeyingてきた、と私はテキストを拾うように見えることはできませんリピータのラベルから削除します。

This postここでは、この記事の構文（$（this）.next（ 'label'）。text（）;）を取得しましたが、これ以外に何も試みていないようです。

ありがとうございました。

EDIT：提案ごとに、ここに私のコードによって生成された実際のマークアップです。 Labelコントロールがspan HTML要素としてレンダリングされるデフォルトで

<table class="c_analyte_table"> 
<tr> 
<th> 
<img class="c_imgPlusMinus" src="Images/plus.jpg" /> 
</th> 
<th> 
<input id="chkConAll" type="checkbox" name="ctl00$MainContent$rptConventionals$ctl00$chkConAll" /> 
Conventionals 
</th>  
</tr>  
<tr class="cd_chemRow"> 
<td > 
</td> 
<td> 
<span class="cd_chkLab"><input id="" type="checkbox" name="ctl00$MainContent$rptConventionals$ctl01$ctl00" /></span><span>Total Suspended Solids, Particulate</span> 
</td> 
</tr> 
<tr class="cd_chemRow"> 
<td > 
</td> 
<td> 
<span class="cd_chkLab"><input id="" type="checkbox" name="ctl00$MainContent$rptConventionals$ctl02$ctl00" /></span><span>Total Suspended Solids, Total</span> 
</td> 
</tr> 
</table> 

Answer 1

：リピータは2つの行を生成します。このコントロールが実際にlabelとしてレンダリングするプロパティーAssociatedControlIDを設定している場合のみです。

このプロパティが設定されていないため、labelのクエリでは何も表示されません。 spanを照会する必要があります。

Checkboxは<span><input></span>にレンダリングされるため、入力要素自体には兄弟はありませんので、まず親に到達する必要があります。

すべてのすべて：

wholeString = $(this).parent().next('span').text(); 

別の解決策、1おそらく単純、ラベルにいくつかのクラスを割り当てることであろう。それはクエリーのための区別としてのみ機能するので、どのCSSでも定義する必要はありません。たとえば、あなたが言うことができる：

<Label CssClass="checkboxLabel" .../> 

クエリ希望ASP.NETレンダリングエンジンの詳細から独立して：。

wholeString = $(this).parent('td').find('.checkboxLabel').text();