如果复选框被选中，jQuery高亮表格行

Question

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

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

我给所有复选框都添加了一个名为“checkboxes”的类。 到目前为止，我得到了以下内容：

$(document).ready(function(){ 

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

});

我不确定应该放什么内容。

我尝试了最接近的方法，把这个放进去：

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

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

- coffeemonitor

Answer 1

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

$('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 元素（如果有其他元素则不选）。

- Felix Kling

---

我甚至没有考虑过 .each() 选择器。太好了，谢谢你的提醒。 - coffeemonitor