Tablesorter 主题,单击按钮时更改行背景
我正在使用 tablesorter 2.0,并且我一直在尝试在单击按钮时覆盖 css 主题,但我似乎无法进行任何操作。我尝试向主题文件添加一些 css,但我认为另一个属性正在覆盖它。我想要做的是更改某个类的一行的背景颜色。
如果有人可以检查一下并告诉我在哪里将类和属性添加到该文件中,我们将不胜感激。
这是 tablesorter 的主题文件:
table.tablesorter {
font-family:arial;
background-color: #CDCDCD;
margin:10px 0pt 15px;
font-size: 8pt;
width: 100%;
text-align: left;
border-radius:3px;
}
table.tablesorter thead tr th, table.tablesorter tfoot tr th {
background-color: #e6EEEE;
border: 1px solid #FFF;
font-size: 8pt;
padding: 4px;
}
table.tablesorter thead tr .header {
background-image: url(bg.gif);
background-repeat: no-repeat;
background-position: center right;
cursor: pointer;
}
table.tablesorter tbody td {
color: #3D3D3D;
padding: 4px;
background-color: #FFF;
vertical-align: top;
}
table.tablesorter tbody tr.odd td {
background-color:#F0F0F6;
}
table.tablesorter thead tr .headerSortUp {
background-image: url(asc.gif);
}
table.tablesorter thead tr .headerSortDown {
background-image: url(desc.gif);
}
table.tablesorter thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp {
background-color: #5B5781;
}
这是我用来更改行的 jquery css(它是 $.post() 调用的回调):
function(){
$("#row_"+id).css("background-color", "orange");
}
I am using tablesorter 2.0 and I have been trying to override the css theme when a button is clicked, but I can't seem to get anything going. I tried to add a little css to the theme file, but I think another attribute is overriding it. What I want to do is change the background color of a row of a certain class.
If anyone can check this out and tell me where to add the class and the attribute to this file, it would be appreciated.
Here is the theme file for tablesorter:
table.tablesorter {
font-family:arial;
background-color: #CDCDCD;
margin:10px 0pt 15px;
font-size: 8pt;
width: 100%;
text-align: left;
border-radius:3px;
}
table.tablesorter thead tr th, table.tablesorter tfoot tr th {
background-color: #e6EEEE;
border: 1px solid #FFF;
font-size: 8pt;
padding: 4px;
}
table.tablesorter thead tr .header {
background-image: url(bg.gif);
background-repeat: no-repeat;
background-position: center right;
cursor: pointer;
}
table.tablesorter tbody td {
color: #3D3D3D;
padding: 4px;
background-color: #FFF;
vertical-align: top;
}
table.tablesorter tbody tr.odd td {
background-color:#F0F0F6;
}
table.tablesorter thead tr .headerSortUp {
background-image: url(asc.gif);
}
table.tablesorter thead tr .headerSortDown {
background-image: url(desc.gif);
}
table.tablesorter thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp {
background-color: #5B5781;
}
Here is the jquery css I use to change the row (it's a callback from a $.post() call):
function(){
$("#row_"+id).css("background-color", "orange");
}
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
TR 有背景色并没有什么问题。
您的代码可以工作,但您必须意识到您指定了 TD 的背景颜色为 #FFF。您正在更改 TR 的 BG 颜色,但 TD 的颜色位于其之上。
There's nothing wrong with TR having background-color.
Your code works but you have to realize that you specified that TD have a background-color of #FFF. You are changing the TR's BG color, but TD's color is on top of it.