1

我有这张桌子：

<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 中对此进行编码。感谢所有帮助。

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

4

3 回答 3

2

您可以使用.eachjQuery 中的函数来处理这个问题。

参考：http ://api.jquery.com/jQuery.each/

jQuery :

$("td").each(function() {
    if ($(this).html() != 20) {
        $(this).css("opacity", "0");
    }
});​

JsFiddle：http: //jsfiddle.net/d2arY/

于 2012-07-16T15:48:37.540 回答
2

试试这个：

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 示例

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

于 2012-07-16T15:55:12.160 回答
0 
$('.mytbl tbody tr:first td').map(function(index, el) {

    if ($(el).text() == 60) 

             return $(el).index();  // get index of td that contain 60

}).each(function(i, val) {  // loop over those index

    $('.mytbl tbody td, .mytbl thead th').each(function() {

        $(this).parent().find('td, th').eq(val).hide(); // hide th and td with
                                                        // similar index
    });
});

工作样本

于 2012-07-16T16:35:06.907 回答