jquery 也不包含隐藏这些

Question

我隐藏了所有 TRs 不包含单词的内容。但是 jquery 也隐藏了 THs。

我该如何解决这个问题？

$(window).load(function() {
    $("#check_box").click(function(){
        $( "tr:not(:contains('Foo'))" ).toggle();
    });
});

<table id="gradient-style" summary="LMS">
            <thead>
                <th scope="col">Тема</th>
                <th scope="col">Дата на създаване</th>
                <th scope="col">Разрешаване на проблема</th>
            </thead>
            <tbody><tr><td><a href="ticket.php?id=19">вдигане на скорост</td><td>21.01.2016</td><td>Неразрешен</a></td></tr><tr><td><a href="ticket.php?id=20">задача за стойчо</td><td>21.01.2016</td><td>Неразрешен</a></td></tr><tr><td><a href="ticket.php?id=21">Много ни е студено и нямаме дрехи :(</td><td>21.01.2016</td><td>Неразрешен</a></td></tr><tr><td><a href="ticket.php?id=273">Прибиране у-ва д-р Хюс</td><td>21.01.2016</td><td>Неразрешен</a></td></tr><tr><td><a href="ticket.php?id=275">Прибиране у-ва Шумен</td><td>21.01.2016</td><td>Неразрешен</a></td></tr><tr><td><a href="ticket.php?id=290">Прибиране у-ва Договор Черенча</td><td>21.01.2016</td><td>Неразрешен</a></td></tr><tr><td><a href="ticket.php?id=291">Прибиране у-ва Договор Лятно</td><td>21.01.2016</td><td>Неразрешен</a></td></tr><tr><td><a href="ticket.php?id=371">Лош Сигнал - Велино</td><td>21.01.2016</td><td>Неразрешен</a></td></tr><tr><td><a href="ticket.php?id=390">ресетвачка за мътница </td><td>21.01.2016</td><td>Неразрешен</a></td></tr><tr><td><a href="ticket.php?id=440">Манастир Царевброд</td><td>21.01.2016</td><td>Неразрешен</a></td></tr></tbody></table>

Answer 1

您可以使用上下文来过滤 trs，在您的情况下是 tbody：

$( "tbody tr:not(:contains('Foo'))" ).toggle();

Answer 2

添加一个:has(td)

$("tr:not(:contains('Foo')):has(td)" ).toggle();

JSFiddle: https://jsfiddle.net/0L4fs4jr/3/

注：

大多数其他有效答案建议定位 TBODY，但我通常会找到 TH 在 TBODY 中的页面。这在任何一种情况下都有效。

Answer 3

您正在选择所有 tr。 Select tr 在 tbody 下喜欢以下内容。

$("tbody tr:not(:contains('Foo'))" ).toggle();

Answer 4

$(window).load(function() {
    $("tr>td").hide();
    $("tr>td:contains('test')").show();
});

试试上面的代码。

Answer 5

您的代码有效，只需检查您在 td

中的附件

检查这个固定的 DEMO

Javascript:

$(window).load(function() {
    $("#check_box").click(function(){
        $("tbody tr:not(:contains('Foo'))").toggle();
    });
});

HTML:

<table id="gradient-style" summary="LMS">
    <thead>
        <tr>
            <th scope="col">Тема</th>
            <th scope="col">Дата на създаване</th>
            <th scope="col">Разрешаване на проблема</th>
        </tr>
    </thead>
    <tbody>
    <tr>
        <td><a href="ticket.php?id=19">вдигане на скорост</a></td>
        <td>21.01.2016</td>
        <td>Неразрешен</td>
    </tr>
    <tr>
        <td><a href="ticket.php?id=20">задача за стойчо</a></td>
        <td>21.01.2016</td>
        <td>Неразрешен</td>
    </tr>
    <tr>
        <td><a href="ticket.php?id=21">Много ни е студено и нямаме дрехи :(</a></td>
        <td>21.01.2016</td>
        <td>Неразрешен</td>
    </tr>
    <tr>
        <td><a href="ticket.php?id=273">Прибиране у-ва д-р Хюс</a></td>
        <td>21.01.2016</td>
        <td>Неразрешен</td>
    </tr>
    <tr>
        <td><a href="ticket.php?id=275">Прибиране у-ва Шумен</a></td>
        <td>21.01.2016</td>
        <td>Неразрешен</td>
    </tr>
    <tr>
        <td><a href="ticket.php?id=290">Прибиране у-ва Договор Черенча</a></td>
        <td>21.01.2016</td>
        <td>Неразрешен</td>
    </tr>
    <tr>
        <td><a href="ticket.php?id=291">Прибиране у-ва Договор Лятно</a></td>
        <td>21.01.2016</td>
        <td>Неразрешен</td>
    </tr>
    <tr>
        <td><a href="ticket.php?id=371">Лош Сигнал - Велино</a></td>
        <td>21.01.2016</td>
        <td>Неразрешен</td>
    </tr>
    <tr>
        <td><a href="ticket.php?id=390">ресетвачка за мътница </a></td>
        <td>21.01.2016</td>
        <td>Неразрешен</td>
    </tr>
    <tr>
        <td><a href="ticket.php?id=440">Манастир Царевброд</a></td>
        <td>21.01.2016</td>
        <td>Неразрешен</td>
    </tr>
    </tbody>
</table>

Answer 6

I'm hiding all TRs that not contains word. But the jquery is hiding the THs too.

那是因为 th 也是 tr 的 children。尽管您没有将 th 包装在 tr 中，但浏览器会为您完成此操作以纠正您的错误。

另一种方法（除了一些其他答案）做你想做的事情可能是获得 td 的 parent。

$("#chk").on('change', function() {
 $("td:not(:contains('one'))").parent().toggle();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label><input type="checkbox" id="chk">Show/Hide Twos</label>
<hr>
<table>
 <thead><tr><th>two</th><th>two</th></tr></thead>
 <tbody>
  <tr><td>one</td><td>one</td></tr>
  <tr><td>two</td><td>two</td></tr>
 </tbody>
</table>

Answer 7

随便用 $( "tbody tr:not(:contains('Foo'))").toggle();

jquery 也不包含隐藏这些

jquery not contains hiding ths too

jquery

contains

注：