jQuery/Javascript获取多个元素的类来显示这个类的元素

Question

我正在努力与jQuery的实时搜索。

首先使用以下代码进行实时搜索更新。

//live search function 
    function live_search(list) { 
    $("#search") 
     .change(function() { 
     //getting search value 
     var searchtext = $(this).val(); 
     if(searchtext) { 
      //finding If content matches with searck keyword 
      $matches = $(list).find('a:Contains(' + searchtext + ')').parent(); 
      //hiding non matching lists 
      $('li', list).not($matches).slideUp(); 
      //showing matching lists 
      $matches.slideDown(); 

     } else { 
      //if search keyword is empty then display all the lists 
      $(list).find("li").slideDown(200); 
     } 
     return false; 
     }) 
    .keyup(function() { 
     $(this).change(); 
    }); 
    } 

的问题是，我的列表按字母顺序和containt一个标题为每个字母：

<ul class="begrippen_list leftList col-sm-12 col-md-6"> 
    <li class="header a">A</li> 
    <li class="a"> 
     <a href="#">All</a> 
    </li> 
    <li class="a"> 
     <a href="#">Auto</a> 
    </li> 
    <li class="header b">B</li> 
    <li class="b"> 
     <a href="#">Balls</a> 
    </li> 
    <li class="b"> 
     <a href="#">Bus</a> 
    </li> 
</ul> 

现在的问题：当我在输入型金矿床，jQuery的只显示列表 - 项目与“自动”，但我也希望与头等a（李类）被显示。当我只输入带有类“a”和类“b”的标题时，必须显示。

我想检查他们班的所有$匹配，并显示与$匹配的类li.header可能是解决方案，但不能得到它的工作。

干杯！

Answer 1

您可以遍历并找到$matches的“标题”元素，并在向上滑动时排除。

var $header = $matches.prevAll('li.header'); 

//hiding non matching lists excluding matches heare 
$('li', list).not($matches).not($header).slideUp();