Question

这应该是如此简单，但我被卡住了。我有一个缩略图页面，其中包含几个使用相同类的div，但每个都有唯一的文本。

这就是我所需要的： 1.如果div“foo”包含唯一文本“Bad”，则隐藏“bar”div，但仅限于“容器”，而不是整个页面。 2.如果div“foo”包含“Bad”以外的任何内容，则不执行任何操作。

此代码用于查找“Bad”并隐藏“foo”...但它会在整个PAGE中隐藏它，而不仅仅是在特定的“容器”中。

<div class="container">
<div class="foo">Bad
<div class="bar">Heyo
</div>
</div>
</div>

<div class="container">
<div class="foo">Not Bad
<div class="bar">Heyo
</div>
</div>
</div>



if ($('.foo:contains("Bad")').length > 0) {$( ".bar" ).hide()

这可能吗？

Answer 1

您可以使用以下内容：

$('.foo').each(function(){
    if($(this).is(":contains('Bad')")){
        $(this).children(".bar").hide();
    }
});

fiddle

Answer 2

$('.foo:contains("bar")').each(function() {
  $(this).next('.bar').hide();
});

使用.each()，您将分别浏览每个.foo。这样，您就可以解决每个匹配的.bar，而$('.bar')则不会。（如果不存在匹配的.foo，则永远不会调用内部函数。）

.next('.bar')选择下一个元素，但前提是.bar。

如果div包含文本，则仅在该div中隐藏子项

2 个答案: