在同一頁面上的多個搜索框中動態應用Jquery中的搜索過濾器

Question

我在同一頁面上有多個搜索輸入框，其中包含我想要搜索的不同列表。

我的問題是，當我在一個搜索框中搜索它適用於所有其他搜索框，並且所有其他搜索框也被搜索。我希望它特定的字段用戶搜索

這裏是小提琴鏈接：

jsFiddle

HTML

<ul id="category1"> 
    <li>item1</li> 
    <li>item2</li> 
    <li>item3</li> 
</ul> 
<ul> 
    <li>item27</li> 
    <li>item28</li> 
</ul> 

JS

$(function(){ 

    $('input[type="text"]').keyup(function(){ 

     var searchText = $(this).val(); 

     $('ul > li').each(function(){ 

      var currentLiText = $(this).text(), 
       showCurrentLi = currentLiText.indexOf(searchText) !== -1; 

      $(this).toggle(showCurrentLi); 

     });  
    }); 

}); 

Answer 1

給你輸入自己的ID和武官的處理程序，以它：http://jsfiddle.net/o88bbdkv/1/

$(function(){ 

    $('#searchInput').keyup(function(){ 

    var searchText = $(this).val(); 

    $('ul > li').each(function(){ 

     var currentLiText = $(this).text(), 
      showCurrentLi = currentLiText.indexOf(searchText) !== -1; 

     $(this).toggle(showCurrentLi); 

    });  
    }); 

}); 

<input type="text" id="searchInput" /> 

<ul id="category1"> 
    <li>item1</li> 
    <li>item2</li> 
    <li>item3</li> 
</ul> 
<ul> 
    <li>item27</li> 
    <li>item28</li> 
</ul>