jQuery的搜索多维UL列表

Question

我旁边HTML：

<input type="text" id="search" name="searchword" value="" /> 
<ul id="search_list"> 
    <li>first</li> 
    <li>second</li> 
    <li>third 
     <ul> 
      <li>aaa</li> 
      <li>bbbb 
       <ul> 
        <li>111111</li> 
        <li>22222</li> 
        <li>3333</li> 
       </ul> 
      </li> 
      <li>cccc</li> 
     </ul> 
    </li> 
</ul> 

而且我想通过输入来搜索这个列表。 我键入文本输入和<li>和<ul>的哪些不是搜索结果必须隐藏。

非常感谢你和对不起我的英语不好

Answer 1

使用KEYUP，模糊或当你想搜索和过滤发生改变依赖。

$('#search').change(function() { 
    var searchTerms = $(this).val(); 

    $('li').each(function() { 
     var hasMatch = searchTerms.length == 0 || $(this).is(':contains(' + searchTerms + ')'); 

     $(this).toggle(hasMatch); 
    }); 
}); 

编辑：使解决方案稍微冗长，使其可以更容易阅读。

这是fiddle。