使用类在表中隐藏一行答案

【问题标题】：Hiding a row in the table using class使用类在表中隐藏一行
【发布时间】：2017-09-15 09:05:01
【问题描述】：

我的表中有 2 行的倍数，如下所示。我想在页面加载时在我的表格中到处隐藏第二行模式。

我尝试使用“a-IRR-header”类隐藏，但它隐藏了两行，因为它是两行的公共类。

<tr>
  <th colspan="4" class="a-IRR-header a-IRR-header--group" id="B139078761545827132_1">Basis</th>
</tr>
<tr>
  <th class="a-IRR-header" id="C139079212590827137"><a  data-column="139079212590827137" href="#">Sl</a></th>
  <th class="a-IRR-header" id="C139078981375827134"><a  data-column="139078981375827134" href="#">Question</a></th>
  <th class="a-IRR-header" id="C139079056068827135"><a  data-column="139079056068827135" href="#">Answer</a></th>
</tr>

【问题讨论】：

$('.a-IRR-header').eq(1).hide()
在重新格式化您的 HTML 后，它显示您的 rows 没有任何类。我建议在您需要的地方添加其他类。
@guradio 如果我有多行重复提到的 2 行怎么办
@GirishRRao 在这种情况下，我的答案给出的解决方案将起作用。

标签： jquery html css show-hide tr

【解决方案1】：

您可以通过使用 ccs nth-child() 来实现此目的，例如：

table tr:nth-child(2) {
    background: #ccc;
}

例如：

table tr:nth-child(2) {
    background: #ccc;
}

<table width="100%" border="1">
  <tr>
    <td>&nbsp;</td>
    <td>$</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>$</td>
    <td>&nbsp;</td>
  </tr>
  <!--
  <tr>
    <td>&nbsp;</td>
    <td>$</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>$</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>$</td>
    <td>&nbsp;</td>
  </tr>
  -->
</table>

【讨论】：

【解决方案2】：

$(document).ready(function() {
    $('.a-IRR-header').eq(1).hide()
});

table tr:nth-child(2) {
    background: green;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table width="100%" border="1">
    <tr>
        <th colspan="4" class="a-IRR-header a-IRR-header--group" id="B139078761545827132_1">Basis</th>
    </tr>
    <tr>
        <th class="a-IRR-header" id="C139079212590827137"><a class="a-IRR-headerLink" data-column="139079212590827137" href="#">Sl</a></th>
        <th class="a-IRR-header" id="C139078981375827134"><a class="a-IRR-headerLink" data-column="139078981375827134" href="#">Question</a></th>
        <th class="a-IRR-header" id="C139079056068827135"><a class="a-IRR-headerLink" data-column="139079056068827135" href="#">Answer</a></th>
    </tr>
</table>

【讨论】：

【解决方案3】：

首先我认为你应该检查你的类的语法，太多的大写字母（这是个人意见，但它会帮助你）。

我不太明白您要做什么，但您可以使用 CSS 选择器：

table tr:nth-child(2) {
    display: none;
}

如果你真的需要在加载时隐藏它，你可以使用类似的东西：

$(document).ready(function() {
    $( "table tr:nth-child(2)").css('display', 'none');
})

【讨论】：

这些类是由 Oracle apex 内置添加的。我还想知道如果我有多行重复提到的 2 行怎么办。
对，我不知道 :) ！我编辑了我的帖子，它应该可以工作。

【解决方案4】：

你可以这样做：

$(document).ready(function(){
    $('tr:eq(1)').hide();
});

所有 tr 都带有 3 th 而不是 a-IRR-header 类——组因为有 tr 标签带有 3 th 与我不想打扰的其他类：

$.each('tr').function({
    if($(this).find('th').not('.a-IRR-header').length == 3)
    {
        $(this).parents('tr:first').hide();
    }
});

【讨论】：

如果我有提到的 2 行的倍数，比如 50 行。我想有选择地隐藏上面问题中第二行类型的行。此外，假设 class="a-IRR-headerLink" 不存在。请回答
所以你想隐藏所有包含三个 TH 的 TR？
是的。所有 tr 都带有 3 th 而不是 a-IRR-header-group 类因为有 tr 标签带有 3 th 和其他我不想打扰的类。