jquery - チェックボックスの選択でjQueryを使用して行を強調表示する

Question

チェックボックスがオンになっているときに、jQueryを使用してテーブルの行を強調表示しようとしました。同じためにこのjQueryコードを使用しました。

$(":checkbox").change(function() {
    $(this).closest("tr").toggleClass("highlight", this.checked);
});

代替行についてのみ正しく取得しています。次のCSSを使用して、テーブルの代替行のスタイルを設定しました。

.tables tbody tr:nth-child(2n){
    background-color:#F9F9F9;
}

偶数行も強調表示するにはどうすればよいですか？

Answer 1

このスタイルをcssファイルに追加するだけです

.tables tr.highlight td {
  background-color: #FFF9DC;
}

問題は、偶数行のスタイルがハイライトスタイルを上書きすることです。したがって、あなたがしなければならないのは、ハイライトスタイルをより重要にすることです。