如何检查表行是否只有1个可见表列

时间:2012-01-25 01:22:07

标签: javascript jquery html

假设我有一个id为“unique”的表,并且我已经执行了

$('.8').hide();
$('.3').hide();

现在我只想显示带有1个可见列的行并隐藏其余部分,IE我要隐藏除第一行之外的所有行(仍然隐藏第二和第三列),如何检查表行有超过1个可见的柱子吗?

<table id="unique">
<tr class = "opponent4 opponent3 opponent5">
<td class="1">1</td>
<td class="3">3</td>
<td class="8">8</td>
</tr>
<tr class = "opponent7 opponent3 opponent9">
<td class="1">1</td>
<td class="1">1</td>
<td class="8">8</td>
</tr>
<tr class = "opponent1 opponent3 opponent4">
<td class="1">1</td>
<td class="2">2</td>
<td class="8">8</td>
</tr>

4 个答案:

答案 0 :(得分:1)

获取一系列TR。过滤出包含1个可见TD的那些。隐藏其余部分。

$("#unique tr").filter(function() { return $(this).find("td:visible").length != 1}).hide();

答案 1 :(得分:1)

$.each($('unique tr'), function() { //Loop through rows
  if ($(this).children('td:visible').length > 1) { //If this row has more than one visible column
    $(this).hide(); //hide this row
  }
}

<强>更新

如果这是你的程序的关键部分,我会将这样的东西保存到函数中。

$.fn.multipleColumnRows = function() {
  var result = [];
  $.each($(this).children('tr'), function() { 
      if ($(this).children('td:visible').length > 1) {
        result.push($(this));
      }
   }
   return result;
}

$('#unique').multipleColumnRows.hide();

答案 2 :(得分:0)

$('tr', '#unique').each(function(i,t){
if('td:visible', $(t)).length == 1)
$(t).show();
Else $(t).hide();
});

答案 3 :(得分:-1)

$(function() {
    var i = 0;
    $.each($(".8"), function() { 
        if (i === 0) { 
            i++;
        } else {
            $(this).hide();
        }
    });
});

然后为其他人做!别忘了将i重置为0