首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >根据标题文本更改列的背景色

根据标题文本更改列的背景色
EN

Stack Overflow用户
提问于 2012-03-03 06:13:13
回答 5查看 5.5K关注 0票数 1

问题:如果标题td中有特定文本,则需要更改整个列的背景颜色。我尝试了几种不同的方法,但都没有成功。

我尝试使用以下命令获取标题:

$('td:contains(Sun)').addClass('.weekend');

它甚至不能改变颜色。这就是我现在被卡住的地方。

EN

回答 5

Stack Overflow用户

回答已采纳

发布于 2012-03-03 06:59:35

Fiddle

代码语言:javascript
运行
复制
var txt = 'Header 2';
var column = $('table tr th').filter(function() {
    return $(this).text() === txt;
}).index();

if(column > -1) {
    $('table tr').each(function() {
        $(this).find('td').eq(column).css('background-color', '#eee');
    });
}
票数 3
EN

Stack Overflow用户

发布于 2012-03-03 06:22:53

由于你没有提供太多的细节,我不得不即兴发挥你的尝试,但我在jsFiddle上拼凑了here's a quick demo。它的主旨是:

代码语言:javascript
运行
复制
.selected {
    background-color: #ddd;
}​

$('table th').click(function () {
    var index = parseInt($(this).index(), 10) + 1;
    $('.selected').removeClass('selected');
    $('table tbody tr :nth-child(' + index + ')').addClass('selected');
});​

这将需要更新以评估所选th的文本,但它可能足以让您入门

票数 0
EN

Stack Overflow用户

发布于 2012-03-03 06:31:40

下面这样的代码就可以解决这个问题了,

JS:

代码语言:javascript
运行
复制
$('document').ready(function() {
    $('table thead th').click(function() {
        var colIndex = $(this).index();
        $('table tbody tr').each(function() {
            $(this).find('td').each(function(i) {
                if (i == colIndex) {
                    $(this).addClass('selCol');
                } else {
                    $(this).removeClass('selCol');
                }
            });
        });
    });
});

CSS:

代码语言:javascript
运行
复制
.selCol { background-color: #c2c2c2; }
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/9541110

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档