4

如果 tr 的 td 不包含 text2,我想隐藏它。当我使用此代码时:

$('td:contains("text2")').parent().toggle()}))

它隐藏了 td 中包含 text2 的 tr ,但我想隐藏 td 中不包含 text2 的所有表格行,所以我编写了以下代码:

$('td:not(:contains("text2"))').parent().toggle()}))

但它隐藏了所有行。

jsfiddle 示例

4

4 回答 4

6

您当前遇到的问题是,如果 atd不包含text2,它将隐藏整行,无论兄弟是否td包含文本。

在不更改任何标记的情况下,我能想到的最好的办法是选择td每一行的第一行,然后在 parent 上进行过滤tr

$('td:first-child').parent('tr:not(:contains("text2"))').toggle();

或者您可以直接在 上过滤tr,省略那些有th元素的(这样你的包含的行th's就不会被隐藏):

$('tr:not(:has(th)):not(:contains("text2"))').toggle();

这是一个小提琴

于 2013-10-16T13:56:30.007 回答
0

它不起作用,因为如果任何列不包含 text2 那么它将隐藏该行。

您可以使用以下内容,但如果条件适用于任何列,则必须区分标题和其他行。

contains()适用于任何后代,因此您可以直接检查 tr 的条件

$('tr:not(.head):not(:contains("text2"))').toggle()

这是更新的JSFiddle

于 2013-10-16T13:51:23.543 回答
0

试试这个:

$(document).ready(function(){
    $('#contains').change( function() {
        $('td:contains("text2")').parent().toggle()
    });

    $('#notContains').change( function() {
        $('td').parent().toggle();
        $('td:contains("text2")').parent().toggle();
    });
});
于 2013-10-16T13:53:23.330 回答
-1

使用此代码进行更改

你很好,但最初你必须找到元素,所以使用 find...

家长:

获取当前匹配元素集中每个元素的父元素,可选地由选择器过滤。

寻找:

获取当前匹配元素集中每个元素的后代,由选择器、jQuery 对象或元素过滤。

因此,使用此代码进行更改

用 text2 隐藏 td:

     $(document).find('td:contains("text2")').toggle()}));

隐藏没有 text2 的 td:

     $(document).find('td:not(:contains("text2"))').toggle()}));

这是代码

$(document).ready( 
$('#contains').change( function() {
    $(document).find('td:contains("text2")').toggle()}));
 $(document).ready( 
 $('#notContains').change( function() {

  $(document).find('td:not(:contains("text2"))').toggle()}));

演示

多谢,伙计

于 2013-10-16T14:22:55.310 回答