如果选中复选框，则 jquery 突出显示表行答案

【问题标题】：jquery highlight table row if checkbox is checked如果选中复选框，则 jquery 突出显示表行
【发布时间】：2011-11-04 21:48:33
【问题描述】：

如果我“点击”一个元素，我知道如何突出显示表格行。

但是当我打开一个页面时，一些复选框已经被选中。我想在页面加载时使用 jquery 突出显示这些行。

我给我所有的复选框一个“复选框”类。到目前为止，这是我得到的：

$(document).ready(function(){ 

   if( $('.checkboxes').attr("checked") == true ){ /*not sure how to detect a row*/  }

});

我不知道该放什么。

我得到的最接近的是放置这个：

$(this).closest('tr').addClass("pinkrow");

但是$(this) 显然没有检测到。

【问题讨论】：

【解决方案1】：

您可以使用.each() ^[docs] 和:checked ^[docs] 伪选择器：

$('tr .checkboxes:checked').each(function() {
    $(this).closest('tr').addClass('pinkrow');
});

如果你只想使用纯 CSS 选择器，你可以使用 DOM 元素的 checked 属性来测试一个元素是否被检查：

$('tr .checkboxes').each(function() {
    if(this.checked) {
        $(this).closest('tr').addClass('pinkrow');
    }
});

另请注意，tr .checkboxes 仅选择那些位于表格行中的 .checkboxes 元素（以防有其他元素）。

【讨论】：