Question

我有一个表，其中每行第一列是复选框，其余列是文本。我想要做的是追溯更改选中复选框的任何行的第2列：n列中文本的颜色。

我正在使用jQuery（并试图刷新我的知识）所以使用它的解决方案将是首选，但直接JS也是AOK。

找到解决方案：

$("input:checked").each(function(idx) {
   $(this).parent().siblings('td').css("color", "red");
});

Answer 1

这是一个jsfiddle example，当选中复选框时会将sibling <td>元素变为红色，并在取消选中时将其变为白色。

使用这个基本的HTML，

<table>
    <tr><td><input type="checkbox" /></td><td>Cell 2</td><td>Cell 3</td></tr>
    <tr><td><input type="checkbox" /></td><td>Cell 2</td><td>Cell 3</td></tr>
    <tr><td><input type="checkbox" /></td><td>Cell 2</td><td>Cell 3</td></tr>
</table>

这个Javascript。

(function($) {
    $(document).ready( function() {
        $('input[type=checkbox]').click( function(e) {
            var bgColor = $(this).attr('checked') == 'checked' ? '#f00' : '#fff';

            $(this).parent().siblings('td').css('background', bgColor);   
        }); 
    });

})(jQuery);

选中复选框时更改表列文本的颜色

1 个答案: