javascript - 如何根据行单元格值隐藏/显示表格列？

Question

我有这张表:

<table class="mytbl">
 <thead>
  <tr>
    <th>dyn-tbl-hdr-1</th>  <----these actually are timestamps.
    <th>dyn-tbl-hdr-2</th>
    <th>dyn-tbl-hdr-3</th>
    <th>dyn-tbl-hdr-4</th>
    <th>dyn-tbl-hdr-5</th>
    <th>dyn-tbl-hdr-6</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>20</td>
   <td>50</td>
   <td>60</td>
   <td>20</td>
   <td>50</td>
   <td>60</td>
  </tr>
  <tr>
   <td>33</td>
   <td>5455</td>
   <td>4550</td>
   <td>245</td>
   <td>50566</td>
   <td>5678</td>
  </tr>
  <tr>
   <td>33433</td>
   <td>598455</td>
   <td>894550</td>
   <td>96245</td>
   <td>7050566</td>
   <td>4325678</td>
  </tr>
 </tbody>
</table>

我只想显示第一行值为 20(或 20 和 60)的那些“列”。我想根据任何行的单元格值显示/隐藏列。目标是仅显示给定行中的单元格值匹配的那些列。 (所以在上面的例子中只显示第 1 行包含 20 的那些列(如果用户想看到 20)。我可以只显示 ro1 包含 20 和 50 的那些列吗？我想我需要先选择一行，然后单元格值，然后根据该行和选定的单元格值隐藏列。但我不确定如何在 jquery 中对此进行编码。感谢所有帮助。

在我的应用程序中，表是动态生成的。表头不是常量，它们实际上是时间戳。

Answer 1

试试这个:

var col = new Array();
$('tr').eq('1').find('td').each(function() {
    if ($(this).text() == 20 || $(this).text() == 50) {
        col.push($(this).index());
    }

});
$('th,td').each(function() {
    if ($.inArray($(this).index(), col)==-1) $(this).hide();
});​

jsFiddle example

这会在表格的第一个非标题行中搜索 20 或 50 的值，并隐藏没有这些值的列。