如果选中复选框,则jquery突出显示表行

Question

如果我"点击"一个元素,我知道如何突出显示表格行.

但是当我打开一个页面时,已经检查了一些复选框.我想在页面加载时使用jquery突出显示这些行.

我给了我所有的复选框一类"复选框".这是我到目前为止所得到的:

$(document).ready(function(){ 

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

});

我不知道该把什么放进去.

我得到的最接近的是:

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

但$(this)显然没有发现.

Answer 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表行中的那些元素(如果有其他元素).