Tablesorter 主题,单击按钮时更改行背景

发布于 2024-11-07 18:09:49 字数 1385 浏览 0 评论 0原文

我正在使用 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 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

左岸枫 2024-11-14 18:09:49

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.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文