如何在javascript中創建簡單的搜索功能？

Question

我從一些學校開始，然後我想測試一個輸入的值是否與這些學校中的一個匹配。 這裏是我的代碼至今：

var $schools = [ 
    'University of Tennessee-Knoxville', 
    'Maryville College', 
    'Cleveland State Community College', 
    'East Tennessee State University' 
    ]; 
    var $searchBar = $('input.searchBar'); 
    $searchBar.keyup(function(){ 
     var $searchValue = $searchBar.val(); 
     for (var x = 0; x < $schools.length; x++) { 
      var $schoolLC = $schools[x].toLowerCase(); 
      var $searchLC = $searchValue.toLowerCase(); 
      var $searchingValue = new RegExp('.*' + $searchLC + '.*'); 
      if ($schoolLC.match($searchingValue)) { 
       console.log($searchLC); 
      } 
     } 
    }); 

但事情顯然是錯誤的（我相信我的正則表達式），因爲它從來沒有console.logs的$ searchLC。

非常感謝！

Answer 1

這不是

if ($searchLC.match($searchingValue)) { 

應該是

if ($schoolLC.match($searchingValue)) { 

Answer 2

我想你需要逃避所有正則表達式特殊字符：

function escapeRegExp(str) { 
    return str.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&"); 
} 

... 
var $searchingValue = new RegExp('.*' + escapeRegExp($searchLC) + '.*'); 
... 

Answer 3

試試這個：Live Demo

for (var x = 0; x < $schools.length; x++) { 
    var $schoolLC = $schools[x].toLowerCase(); 
    var $searchLC = $searchValue.toLowerCase(); 
    var $searchingValue = new RegExp('.*' + $searchLC + '.*'); 
    if ($schoolLC.match($searchingValue)) { 
     alert($schoolLC); 
    } 
} 

Answer 4

那麼，對於這個特殊的例子，而不是使用匹配您可以使用的indexOf使你的代碼變得

var $schools = [ 
'University of Tennessee-Knoxville', 
'Maryville College', 
'Cleveland State Community College', 
'East Tennessee State University' 
]; 
var $searchBar = $('input.searchBar'); 
$searchBar.keyup(function(){ 
    var $searchValue = $searchBar.val(); 
    for (var x = 0; x < $schools.length; x++) { 
     var $schoolLC = $schools[x].toLowerCase(); 
     var $searchLC = $searchValue.toLowerCase(); 
     if ($schoolLC.indexOf($searchLC) >= 0) { 
      console.log($searchLC); 
     } 
    } 
});