单击特定表格行时更改背景颜色

Question

我想更改特定单击的表格行的背景颜色。它也应该把它改回原来的颜色。从红色到绿色来回。它还应该选中复选框。绿色 = 复选框已选中/红色 = 复选框未选中。

行看起来像这样 <tr id="<?php echo $row['id'] ?>" value="<?php echo $row['id'] ?>">

对于 JQUERY 我有这个：

$(document).ready(function() {

    $('.table tr').click(function(event) {

        var id = $(this).attr('id');

        var bcolor = $('.task').css('background-color');

        console.log(id);

        console.log(bcolor);

if (event.target.type !== 'checkbox') {

            $(':checkbox', this).trigger('click');

            if (bcolor == 'rgb(205, 92, 92)') {

                $('.task').css('background-color', 'green');

            } else {

                $('.task').css('background-color', 'indianred');

            }

        };

    });

});

如何使用var id = $(this).attr('id');仅更改特定单击行的背景颜色？

现在，它通过单击其中任何一行使每一行变为绿色。

Answer 1

您可以使用 jQuery 的 toggleClass：// css for put in your element.common-class {&nbsp; &nbsp; background-color: #ff0000; // replace for your color}.highlight-class {&nbsp; &nbsp; background-color: #0000ff !important; // replace for your color}$('your-selector').toggleClass('highlight-class'); // jQuery