Javascript 单击更改表格行的颜色

我已经创建了一个表格，表格中有交替颜色的行（比如黄色和红色）。现在，我想将单击行的颜色更改为一种常见颜色（例如蓝色），并在再次单击时恢复为其原始颜色。 我可以用这个代码改变颜色

$("#mainTable").find('#'+IDClicked).css("background-color", "#bbbbff");

---

我不知道如何恢复。

我们假设您的代码是这样的：

HTML 最后是CSS部分： 小提琴：试试这个：

$('table tr').toggle(function(){
$(this).addClass('myclass');
}, function(){
$(this).removeClass('myclass');
});​

css

.myclass{
background: red;
}

table tr{
 background: yellow;
}

试试下面的代码

CSS

.high-light{background:blue !important;}

jQuery

$(document).ready(function(){

 $('table tr').click(function(){ $(this).addClass("high-light");  });
 //If you have TD's background set try the below commented code
  $('table tr td').click(function(){ $(this).parent().find('td').addClass("high-light");  });
});

---

准确回答您的问题：

$('#box').on('click', function() {
    var box$ = $(this),
        isBgColorChanged = box$.data('isBgColorChanged'),
        bgColor = !!isBgColorChanged ? '#444' : '#ccc';
    box$.css('background-color', bgColor)
        .data('isBgColorChanged', !isBgColorChanged);
});​

$('#box').on('click', function() {
    $(this).toggleClass('activated');
});​

更优雅的解决方案：

$('#box').on('click', function() {
    var box$ = $(this),
        isBgColorChanged = box$.data('isBgColorChanged'),
        bgColor = !!isBgColorChanged ? '#444' : '#ccc';
    box$.css('background-color', bgColor)
        .data('isBgColorChanged', !isBgColorChanged);
});​

$('#box').on('click', function() {
    $(this).toggleClass('activated');
});​

---

哇！！你很快给了我一个答案。。但我不能接受它足够快！：）完全解决了。。非常感谢。当然……：）欢迎，还添加了小提琴！：）您可以使用

toggleClass（）

，它也可以这样做@PraveenKumar，我只想知道哪个会执行更快更好的解决方案？

$('#box').on('click', function() {
    $(this).toggleClass('activated');
});​