显示并突出显示精确的单词匹配

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/