如果 tr 的 td 不包含 text2,我想隐藏它。当我使用此代码时:
$('td:contains("text2")').parent().toggle()}))
它隐藏了 td 中包含 text2 的 tr ,但我想隐藏 td 中不包含 text2 的所有表格行,所以我编写了以下代码:
$('td:not(:contains("text2"))').parent().toggle()}))
但它隐藏了所有行。
如果 tr 的 td 不包含 text2,我想隐藏它。当我使用此代码时:
$('td:contains("text2")').parent().toggle()}))
它隐藏了 td 中包含 text2 的 tr ,但我想隐藏 td 中不包含 text2 的所有表格行,所以我编写了以下代码:
$('td:not(:contains("text2"))').parent().toggle()}))
但它隐藏了所有行。
您当前遇到的问题是,如果 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();
它不起作用,因为如果任何列不包含 text2 那么它将隐藏该行。
您可以使用以下内容,但如果条件适用于任何列,则必须区分标题和其他行。
contains()
适用于任何后代,因此您可以直接检查 tr 的条件
$('tr:not(.head):not(:contains("text2"))').toggle()
这是更新的JSFiddle
试试这个:
$(document).ready(function(){
$('#contains').change( function() {
$('td:contains("text2")').parent().toggle()
});
$('#notContains').change( function() {
$('td').parent().toggle();
$('td:contains("text2")').parent().toggle();
});
});
使用此代码进行更改:
你很好,但最初你必须找到元素,所以使用 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()}));
多谢,伙计