Question

我正在尝试打开/关闭某些表格单元格的内嵌背景颜色。 HTML表是动态创建的，因此我可能不会添加任何类。它有自己的CSS，但有些TD也有内联样式。我想打开/关闭这些内联样式，以便用户可以在CSS样式或内联样式之间进行选择。单元格可能具有不同的内联背景颜色。

我可以选择具有内联样式的TD：

$('.tbl_container td[style*="background-color"]');

但是，如果我尝试这样的东西，它会删除内联背景但不会恢复它：

$('.tbl_container td[style*="background-color"]').toggle(function(){
    $(this).css('background-color', '');
});

我想我必须使用hide()，但我不知道如何。

Answer 1

您可以将class名称用于这些目的。

.color{
background-color: blue;
}

.color2{
background-color: white;
}

然后在jQuery你可以这样做

$('.That_particular_td').on('click',function(){
    if($(this).attr('class')== 'color'){
        $(this).attr('class','color2');
    }
    else if($(this).attr('class')== 'color2'){
       $(this).attr('class','color');
    }
});

注意：

您可以使用 jQuery On() 方法动态创建HTML元素

Answer 2

对表行使用CSS odd和even selector。更简单，没有javascript / jquery。

更多说明请使用以下链接。

http://www.w3.org/Style/Examples/007/evenodd.en.html

切换内联样式背景颜色

2 个答案: