顯示並突出顯示精確的單詞匹配

Question

我正在爲數據創建自定義過濾器。我想在精確的單詞匹配上顯示結果。例如我有以下數據。如果我們在搜索輸入中鍵入「amit」，那麼第一行應該顯示哪一行正在工作，但是當我們輸入「mit」時，不應該可見行。 fiddle

<li><strong>my name is amit</strong>, address</li> 
<li><strong>my name is geeta</strong>, address</li> 
<li><strong>my name is xyz</strong>, address</li> 

Answer 1

大廈斯里達爾的解決方案之上，我建了一個演示https://jsfiddle.net/sumL5eas/15/，也搜索開始的話：

在我的解決方案，首先檢查文本是否以搜索詞開始，如果是，則顯示該項。否則，它將使用" " + searchTerm搜索文本。

$('.inp').keyup(function(){ 

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

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

     var currentLiText = $(this).text(); 
     var showCurrentLi = currentLiText.indexOf(searchText) == 0; 
     if(!showCurrentLi) 
      showCurrentLi = currentLiText.indexOf(" " + searchText) !== -1; 

     $(this).toggle(showCurrentLi); 

    });  
}); 

Answer 2

試試這個代碼

$(function(){ 

    $('.inp').keyup(function(){ 

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

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

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

      $(this).toggle(showCurrentLi); 

     });  
    }); 

}); 

鏈接：http://jsfiddle.net/sumL5eas/5/