单击添加和删除表格数据的背景色(td）

On-click adding and removing background color of a table data(td)

本文关键字：背景色 td 数据 添加 删除 表格 单击      更新时间：2023-09-26

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

java script:
  jQuery('td').click(function () { $(this).addClass('active'); });
my css class:
.active{background-color:red;}

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

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

toggleClass在不存在时添加，在存在时删除。

您可以使用

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

尽管您需要检查它是否已经处于活动状态，但这会使您的代码看起来像这样：

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

编辑：

@正义更正确：

jQuery('td').click(function () { $(this).toggleClass('active'); });
相关文章：