jquery包含找不到以前的类

时间:2014-07-03 14:46:46

标签: jquery contains

<div id='id1' class="mainDiv">Something</div>
<div class="dispatch" id="dis1">Dispatch</div><table><tr><td>Just</td><td>a table</td></tr></table>  
<div class='orderDiv'>Something else</div>  

<div id='id2' class="mainDiv">Something</div>
<div class="dispatch" id="dis2">Dispatch</div><table><tr><td>Just</td><td>a table</td></tr></table>  
<div class='orderDiv'>KEYWORD</div>  

<div id='id3' class="mainDiv">Something</div>
<div class="dispatch" id="dis3">Dispatch</div><table><tr><td>Just</td><td>a table</td></tr></table>  
<div class='orderDiv'>Something else</div>

我想通过搜索“KEYWORD”的非存在来将id1和id3设置为display:none。

我试过

$(".orderDiv")
    .not(':contains("KEYWORD")')
    .prevAll('.mainDiv:first')
    .css('display','none');

但这只会使id1不可见。

更新
所有JSFiddle工作都很感谢,但它不适用于我现在更新的原始html结构。将dis1和dis3也隐藏起来也很棒。

2 个答案:

答案 0 :(得分:0)

这将隐藏id1和id3

    $(".orderDiv").not(':contains("KEYWORD")').prevAll('.mainDiv').not(':eq(1)').each(function()
         {
         $(this).css('display','none')
      });

DEMO

答案 1 :(得分:0)

您可以使用filter功能:

$('.mainDiv').filter(function() {
    return !$(this).next('.orderDiv:contains(KEYWORD)').length;
}).hide();

Example

如果您只想显示匹配的主div和订单div,您还可以将以下内容链接到最后:

.next('.orderDiv').hide();

Example

根据您的修改进行更新

var divs = $('.orderDiv').not(':contains(KEYWORD)')

divs.each(function() {
    var div = $(this);
    div.hide()
        .prev('table').hide()
        .prev('.dispatch').hide()
        .prev('.mainDiv').hide();
});

Fiddle

If you just want to hide the mainDiv and dispatch