jQueryUI Autocomplete - 検索語をキーワードのリストと照合し、一致する結果を表示する方法？

Question

jQueryUIオートコンプリートを使用して、サイト内のさまざまな機能ページのサイトクイック検索機能を実装しようとしています。私はあなたがGoogleのインスタント検索のようだと言うことができると思うが、それは私のサイトのページのインデックスを作成している。

したがって、「作成」を検索すると、「ユーザーの作成」オプションと「組織の作成」オプションが表示されます。ユーザーが「使用を作成」を検索すると、「ユーザーの作成」オプションのみが表示されます。次に、結果をクリックすると、そのページが読み込まれます。これらはリンクの一部です。しかし、あなたが見ることができるように、各ページには、すべて同じページを指す様々なキーワード/同義語がいくつかあります。

私はそれをテストしたので、最後にcheckSearchWordsMatchKeywords関数は間違いなく動作します。機能していないのは、jQueryUI検索関数から返されるものがわからないということです。

また、checkSearchWordsMatchKeywords（）関数を最適化する方法が分かっている場合、私はすべて耳にします。 :)

編集：は以下のソリューションを作業で更新（jQueryUIの1.9.xで動作します）：

var links = [ 
{ 
    keywords: ['create', 'add', 'make', 'insert', 'user'], 
    label: "Create user", 
    desc: "Create a user in the system", 
    url: 'http://mysite.com/user/create/' 
}, 
{ 
    keywords: ['create', 'add', 'make', 'insert', 'organisation'], 
    label: "Create organisation", 
    desc: "Create an organisation in the system", 
    url: 'http://mysite.com/organisation/create/' 
}]; 

$('#searchTerms').autocomplete(
{ 
    minLength: 2, 
    source: function(request, response) 
    { 
     var matched = []; 
     var numOfLinks = links.length; 

     // Get entered search terms (request.term) from user and search through all links keywords 
     for (var k = 0; k < numOfLinks; k++) 
     { 
      // If it matches, push the object into a new array 
      if (checkSearchWordsMatchKeywords(request.term, links[k].keywords)) 
      { 
       matched.push(links[k]); 
      } 
     } 

     // Display the filtered results 
     response(matched); 
    }, 
    focus: function(event, ui) 
    { 
     // When the item is selected, put the label text into the search box 
     $('#searchTerms').val(ui.item.label); 
     return false; 
    }, 
    select: function(event, ui) 
    { 
     // Put the selected link's label in the text box and redirect to the url 
     $('#searchTerms').val(ui.item.label); 

     // Redirect to the page using .href so the previous page is saved into the user's browser history 
     window.location.href = ui.item.url; 
     return false; 
    } 
}) 
.data('autocomplete')._renderItem = function(ul, item) 
{ 
    // Show a description underneath the link label. Using the hyperlink here too so that mouse click still works 
    return $('<li></li>') 
     .data('item.autocomplete', item) 
     .append('<a href="' + item.url + '"><b>' + item.label + '</b><br>' + item.desc + '</a>') 
     .appendTo(ul); 
}; 

/** 
* Check that each word in a search string matches at least one keyword in an array 
* E.g. searchWords = 'create use' and keywords = ['create', 'add', 'make', 'insert', 'user'] will return true 
*/ 
function checkSearchWordsMatchKeywords(searchString, keywords) 
{ 
    var searchWords = searchString.toLowerCase().split(' '); // Lowercase the search words & break up the search into separate words 
    var numOfSearchWords = searchWords.length;     // Count number of search words 
    var numOfKeywords = keywords.length;      // Count the number of keywords 
    var matches = [];           // Will contain the keywords that matched the search words 

    // For each search word look up the keywords array to see if the search word partially matches the keyword 
    for (var i = 0; i < numOfSearchWords; i++) 
    { 
     // For each keyword 
     for (var j = 0; j < numOfKeywords; j++) 
     { 
      // Check search word is part of a keyword 
      if (keywords[j].indexOf(searchWords[i]) != -1) 
      { 
       // Found match, store match, then look for next search word 
       matches.push(keywords[j]); 
       break; 
      } 
     } 
    } 

    // Count the number of matches, and if it equals the number of search words then the search words match the keywords 
    if (matches.length == numOfSearchWords) 
    { 
     return true; 
    } 

    return false; 
} 

ジャンプ私は "検索" していないページ

Answer 1

にイベントあなたが何をしているかを行う場所です。 requestオブジェクトが入力

に入力されたテキストがresponseパラメータは、あなたが呼び出す必要があり、コールバックですtermプロパティが含まれてい

$("#searchTerms").autocomplete({ 
    ... 
    source: function(request, response) {   
     var matched = []; 
     // Search "request.term" through all links keywords 
     for (var k = 0; k < links.length; k++) { 
      if (checkSearchWordsMatchKeywords(request.term, links[k]['keywords'])) { 
       matched.push(links[k]); 
      } 
     } 
     // display the filtered results 
     response(matched); 
    } 
}); 

• ：あなたは、むしろ、コールバックとしてsourceオプションを実装する必要があります結果を表示します。

基本的に、データを取得してフィルタリングし、response()に渡してメニューを表示します。