Question

我想创建一个jquery过滤器，找到具有某个类的列表元素，然后隐藏（每隔一个列表元素）

下面的代码找到带有类的li项并隐藏它们 - 但我想做相反的事情。（不太确定如何做到这一点）

这是jsfiddle我的设置。非常感谢您的帮助

＆＃13;

$(document).ready(function() {
  $('.mbodysub').on('click', '#editfilter', function(e) {
     console.log('filter clicked');
     
     //want to do the opposite, just show li where child div has .editcolor class
     $('.mbodysub ul').find(".editcolor").parent('li').toggle();

   })
   $('.mbodysub').on('click', '#tsfilter', function(e) {
     console.log('filter clicked');
     $('.mbodysub ul').find(".tscolor").parent('li').toggle();

   })
   $('.mbodysub').on('click', '#rolefilter', function(e) {
     console.log('filter clicked');
     $('.mbodysub ul').find(".rolecolor").parent('li').toggle();

   })
   });

＆＃13;

这是一个典型的列表元素

＆＃13;

<li id="194" class="external changecss">
          <div class="acl_title" style="overflow:hidden">
            <div id="2137" class="remove">[X]</div>
            <img style="float:left" src="/images/user32.png" width="32" height="32">
            <h3>Jeff Bloggs</h3>
            <p>Program Manager</p>
          </div>
          <div class="colorline editor editcolor"></div>
          <div class="colorline ts"></div>
          <div class="colorline role rolecolor"></div>
  </li>

＆＃13;

Answer 1

您可以通过组合:not()和:has()选择器来否定具有li后代的.editcolor元素：

$('.mbodysub ul li:not(:has(.editcolor))').toggle();

Answer 2

与其他答案类似。

$('li').not('.editcolor').toggle();

找到所有li元素，过滤掉所有具有＆＃39; editcolor＆＃39;类的元素，然后切换其余元素。

Jquery使用类查找列表元素并隐藏其他所有内容

2 个答案: