1

现在我正在玩一个想法，我想改变颜色（可能最终删除/隐藏）一列或一行数据现在我的目标是列。到目前为止，我已经部分工作但不完全

有了这个：

$('#'+arry[0]+' tr td:eq('+arry[1]+')').css({"background-color":"FF0"});

我能够影响该列，但只能影响一行，而不是该列中的所有行，并且它似乎影响“tbody”中的行/列，而不是“thead”或“tfoot”我需要影响所有 3 .

我正在使用的表格示例如下：

<table id="testerTable">
    <thead>
        <th>First</th>
        <th>Second</th>
        <th>Third</th>
        <th>Fourth</th>
        <th>Fifth</th>
    </thead>
    <tbody>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
    </tbody>
</table>

我在想我的方法很简单，所以我需要一些想法。这最终将与来自 d​​atatables.net 的数据表一起使用，但首先我需要弄清楚这部分。

****编辑****

该arry变量当前取自其他东西的 rel 属性arry[0]是表 id..arry[1]在这种情况下是列的位置 0-4

4

3 回答 3

1

我会用<colgroup>它来为列着色，因为它操作起来既快速又容易。

http://www.w3schools.com/tags/tag_col.asp

一个例子，你可以把：

<colgroup>
  <col style="background-color:FF0" />
  <col span="4" />
</colgroup>

并使用 jquery 或其他方式编辑整个 colgroup。

于 2012-04-25T21:17:07.270 回答
1

演示 jsBin

var string= 'testerTable::2'; // your data // test with: 0,1,2,3,4
var arry= string.split('::'); // split to separate values

var $tr = $('#'+arry[0]+' tr');


$('#'+arry[0]+' th').eq(arry[1]).css({"background-color":"FF0"});

$tr.each(function(el){ // iterate through all 'tr' to find relative 'td' .eq()
  $(this).find('td').eq(arry[1]).css({"background-color":"FF0"});
});
于 2012-04-25T21:31:05.637 回答
0

您可以只为第 1 列中的每个元素指定类 'c1'，然后执行 $('.c1').css... 这将节省 th/tr/td 区别的麻烦。当然，你会为每一列都这样做。

顺便说一句，它的拼写是“数组”:)

于 2012-04-25T21:24:01.907 回答