Jquery 单击复选框在TD上添加类

实际上，我正在尝试通过单击复选框来添加类。。是指当我点击复选框时，TD只会突出显示的那一刻。。说喜欢加课。为了更好地理解，我把课堂放在最后一节课上

演示

CSS

使用

---

也可以使用复选框选择器

$('.common input:checkbox').change(function () {
    $(this).closest('td').toggleClass("highlight", this.checked);
});

演示：

使用

.on（'click'，'input:checkbox'）

代替：

// catch every click on a checkbox, localized into .common
$(".common").on('click', 'input:checkbox', function() {
    $(this).closest('td').toggleClass('highlight', this.checked);
});
// initialization
$('.common input:checkbox:checked').closest('td').addClass('highlight');

写：

$(".common input[type='checkbox']:checked").each(function(){
        $(this).closest('td').addClass("highlight");
});
$(".common input[type='checkbox']").change(function() {    
    if($(this).is(":checked")){
        $(this).closest('td').addClass("highlight");
    }
    else{
        $(this).closest('td').removeClass("highlight");
    }    
});

---

非常感谢。。它起作用了。。。但有一件事它会影响第一列复选框第二列不影响。。任何想法如何？任何想法如何也可以做时，页面加载和所有检查td还添加了类…任何想法如何也可以做时，页面加载和所有检查td还添加了类…谢谢。。。。

$(this).closest('.td').toggleClass("highlight", this.checked);

$('.common input:checkbox').change(function () {
    $(this).closest('td').toggleClass("highlight", this.checked);
});

// catch every click on a checkbox, localized into .common
$(".common").on('click', 'input:checkbox', function() {
    $(this).closest('td').toggleClass('highlight', this.checked);
});
// initialization
$('.common input:checkbox:checked').closest('td').addClass('highlight');

$(".common input[type='checkbox']:checked").each(function(){
        $(this).closest('td').addClass("highlight");
});
$(".common input[type='checkbox']").change(function() {    
    if($(this).is(":checked")){
        $(this).closest('td').addClass("highlight");
    }
    else{
        $(this).closest('td').removeClass("highlight");
    }    
});