javascript - 点击添加和删除表格数据的背景颜色（td）

Question

我正在使用 jquery 为表数据设置背景颜色并且它工作正常但是当用户再次单击 td 时我需要取消选择颜色。它是我添加颜色的脚本。

java script:
  jQuery('td').click(function () { $(this).addClass('active'); });

my css class:
.active{background-color:red;}

当用户再次单击 td 时，该类应删除。如何实现这一点。

Answer 1

您可以使用

$(this).removeClass('active');

尽管您需要检查它是否已经处于活动状态，这将使您的代码如下所示：

jQuery('td').click(function () { 
  if($(this).hasClass('active') { 
    $(this).removeClass('active'); 
  } else {
    $(this).addClass('active'); 
  }
});

编辑：

@Justice 更正确：

jQuery('td').click(function () { $(this).toggleClass('active'); });

Answer 2

jQuery('td').click(function () { $(this).toggleClass('active'); });

toggleClass 如果不存在则添加，如果存在则删除。