Question

我已经尝试了几种方法，但从未完全达到我的目标。如果我使用select-All-button，我基本上想要改变每一行的背景颜色：

<th class="w70 c" id="project_table_header_checkbox">
    <input type="checkbox" name="all" value="1" onclick="$('#project-table input[type=checkbox]').not('[disabled]').prop('checked', $(this).prop('checked') ); colorizeRows();">
</th>

我还有一种改变一行颜色的工作方式：

$(":checkbox").change(function() {
    $(this).parents('tr').find('td').toggleClass("bgcolor_grey", this.checked)
})

我认为在我的复选框上只有一个监听器会很有用，只要状态发生变化就会改变行颜色。

我该怎么做？

编辑：

 <div class="fullwidth c" id="project-table">
        <div class="box">
            <table>

            <tr>
                <th class="w70 c" id="project_table_header_checkbox">

Answer 1

检查/取消选中后，使用selectAll在其他复选框上触发change

$('#selectAllId').change(){
    $(":checkbox").not(this).prop('checked', this.checked).change()
});

现在将触发切换行类的当前更改事件处理程序代码

Answer 2

保持您的更改功能为一个复选框，并将这样的内容添加到您的全选复选框（我建议您使用ID来形成并选择所有复选框）

$('#select_all').change(function() {
    var checkboxes = $('#your_form').find(':checkbox');
    if($(this).is(':checked')) {
        checkboxes.prop('checked', true);
    } else {
        checkboxes.prop('checked', false);
    }
});

使用jQuery对表中的每一行进行着色

2 个答案: