Question

我有一个包含多行的表，每个行都有自己的复选框。我有以下脚本来反转所有复选框：

$("INPUT[type='checkbox']").each(function(){
    if (this.checked == false) {
        this.checked = true;
    } else {
        this.checked = false;
    }
});

现在，我希望每一行（它有唯一的ID - 如id='row1' id='row2'等）更改其类名：如果要检查该复选框，则应更改为{ {1}}来class1。

如何做到这一点？我是jQuery的新手，所以我不知道如何获得元素ID或其他东西。我不知道如何将复选框与行匹配。

提前致谢。

Answer 1

您可以使用.closest() ^[docs]获取复选框所在的行：

$("INPUT[type='checkbox']").each(function(){
    var toRemove = this.checked ? 'class1' : 'class2',
        toAdd = this.checked ? 'class2' : 'class1';

    $(this).closest('tr').add(toAdd).remove(toRemove);
    this.checked = !this.checked;
});

（还有其他方法可以避免重复类名，但它们的可读性会降低）

如果最初正确设置了类，您也可以使用.toggleClass() ^[docs]

$("INPUT[type='checkbox']").each(function(){
    this.checked = !this.checked;
    $(this).closest('tr').toggleClass('class1 class2');
});

Answer 2

http://jsfiddle.net/sPgGp/

此处示例。

根据复选框状态更新类名

2 个答案: