jqueryui自动完成如何传递关键字数组以搜索每个对象？

Question

我正在尝试使用jQueryUI自动完成功能为网站中的各种功能页面实现网站快速搜索功能。 因此，当他们搜索“创建”时，它将弹出“创建用户”选项和“创建组织”选项。 当他们搜索“创建u”时，只会显示“创建用户”选项。 这些只是一些链接。 但是正如您所看到的，每个页面都有一些指向同一页面的各种关键字/同义词。

基本上我想要这样的结构：

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/'
}];

因此，当他们键入内容时，应查找links数组，然后搜索关键字数组以根据他们键入的内容查找部分文本匹配项。如果找到一个，则将在自动完成程序中显示该条目。 但是，如果第二或第三个搜索词与任何关键字都不匹配，则不会显示该关键词。

现在，我听说您可以通过提供源作为回调来做到这一点？

到目前为止，这是我的代码（编辑：使用有效的解决方案更新）：

        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 = [];

                // Get entered search terms (request.term) from user and search through all links keywords
                for (var k = 0; k < links.length; 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 )
            {
                $( "#searchTerms" ).val( ui.item.label );
                return false;
            },
            select: function( event, ui )
            {
                // Redirect to the url
                $( "#searchTerms" ).val( ui.item.label );
                window.location.replace(ui.item.url);

                return false;
            }
        })
        .data( "autocomplete" )._renderItem = function( ul, item ) {
            return $( "<li></li>" )
                .data( "item.autocomplete", item )
                .append( '<a href=""><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(searchWords, keywords)
        {
            var searchWords = searchWords.toLowerCase();    // Lowercase the search words
            var searchWords = searchWords.split(' ');       // 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;
        }
    });

好的，最后的checkSearchWordsMatchKeywords函数肯定可以正常工作，因为我已经对其进行了测试。 不起作用的是，我不知道从jQueryUI search：函数返回什么。

有什么帮助吗？

Answer 1

我在工作中遇到了这个问题。 为了解决这个问题，我们创建了自己的搜索功能。 为了搜索keywords即使它们在您要显示的实际字符串中也是如此。

$( "#searchTerms" ).autocomplete({
   search: function(event, ui) {  
      // Add your super search function here
   }
});