如何从Twitter Bootstrap表中删除背景色?

我正在使用Twitter Bootstrap v 2.0.1并为我的表提供了表条带类。 如果点击,我正在尝试更改行颜色。 除了每个没有条纹颜色的第n行之外,这种方法很有效。 我假设我需要首先删除条纹颜色,但我的尝试失败了。 知道我错过了什么吗?

HTML

Col 1 Col 2 Col 3
Data 1 Data 2 Data 3
Data 1 Data 2 Data 3
Data 1 Data 2 Data 3

我的jQuery尝试:

  $(document).ready(function(){ $('tr').click( function() { $(this).siblings().removeClass('table-striped'); //$(this).css('background-color', '#ff0000').siblings().removeClass('table-striped'); }); });  

我究竟做错了什么?

好吧,因为它们是使用: tr:nth-child(odd) td ,我们不能简单地“删除”类表条带 ,因为它会影响整个表。

创建自己的类让我们说: .highlightBG { background:#5279a4; } .highlightBG { background:#5279a4; }

而是这样做:

 $('table.table-striped tr').on('click', function () { $(this).find('td').addClass('highlightBG'); // potentially even .toggleClass('highlightBG'); to alternate it }); 

table-striped是表上的一个类,而不是

或兄弟,所以要么创建一个新类来切换

或jQuery parents('table')要么将$(this)更改为$('table.table')

最后我想你想保留所有其他行的条带化,并更改当前选中的,如果是这种情况,那么使用第一个建议并覆盖$(this)上的新css类不要删除表-striped并确保您的新class级具有更高的特异性。