○環境
IDE:VisualStudio 14.0.23107.0
テンプレート:MVC
言語:VB.NET
Javascript
jQuery
○実現したい事
ページ読み込み時にテーブル要素の各行に存在する
チェックボックスが
チェックオンならその行の背景色を赤くする。(addClass)
チェックオフならその行の背景色は元に戻す。(removeClass)
○現状のソース
Javascript
1 $(document).ready(function () { 2 for (var i = 0; i < $('.data-row').length; i++) { 3 if ($('.ng-flg').get(i).checked) { 4 $('.data-row').eq(i).addClass('ng-row'); 5 } 6 else { 7 $('.data-row').eq(i).removeClass('ng-row'); 8 } 9 } 10 });
HTML
1<table class="list-data"> 2 <thead> 3 <tr> 4 <th><input type="checkbox"></th> 5 <th>コード</th> 6 <th>名前</th> 7 </tr> 8 </thead> 9 <tbody> 10 <tr class="data-row"> 11 <th><input type="checkbox" class="ng-flg"></th> 12 <td>100</th> 13 <td>田中</th> 14 </tr> 15 <tr class="data-row"> 16 <th><input type="checkbox" class="ng-flg"></th> 17 <td>200</th> 18 <td>佐藤</th> 19 </tr> 20 <tr class="data-row"> 21 <th><input type="checkbox" class="ng-flg"></th> 22 <td>300</th> 23 <td>鈴木</th> 24 </tr> 25 </tbody> 26</table> 27
同じクラス名でも.eq(~)で、~番目と指定できると考えているのですが
上手くいきません・・・。
ご教授いただければ幸いです。
質問内容に不足など御座いましたら、ご指摘ください。
回答2件
あなたの回答
tips
プレビュー