jquery-自动完成插件搜索

Question

有一个jquery-自动完成插件，它只允许您搜索确切的字符串。

让我们说这是数据..。

   [
        ['apple is good'],
        ['apple grows on tree'],
        ['the tree and the apple'],
        ['red apple'],
        ['apple tree']
    ]

现在，搜索“苹果”应该显示一切。

但是当输入“苹果树”时，它只返回“苹果树”。

我希望它返回智能结果(2,3和5)。

• “苹果长在树上”
• “树与苹果”
• “苹果树”

这意味着:它应该重新评估搜索的每一个单词(但过滤它从已经过滤的结果)

这个插件允许你提供你自己的搜索。

精细化的搜索能让我们聪明地搜索到什么样子呢？

它需要忽略空格，并将搜索查询拆分为单词，以便对每个单词进行一个接一个的计算。

$("#textInputEle").autocomplete({
    url:"path/to/data.json",
    filter: function(result, filter) {
     //whats should this function be?
    }
});

Answer 1

您可以使用filter选项来提供自己的筛选逻辑。

您提供的函数接受result和filter参数。filter参数是用户搜索的内容。result参数是建议列表中的一个项。您的函数必须返回true (如果建议是匹配的)或false (如果建议不是匹配的)。

做你想要完成的事情的逻辑可能如下所示：

1. 将由空格(" ")传递的result拆分为一个术语数组。
2. 在术语数组中从每个字符串中创建正则表达式
3. 确保用户键入的内容匹配每个正则表达式。

看起来是这样的：

$("#auto").autocomplete({
    data: [
        ['apple is good'],
        ['apple grows on tree'],
        ['the tree and the apple'],
        ['red apple'],
        ['apple tree']
        ],
    filter: function(result, filter) {
        var terms = filter.split(" "),
            match = true,
            i = 0,
            regex;

        for (; match && i < terms.length; i++) {
            regex = new RegExp(terms[i]);
            match = match && regex.test(result.value);
        }

        return match;
    }
});

示例： http://jsfiddle.net/ztkX2/1/

Answer 2

我相信jquery自动完成的开箱即用功能只会返回包含短语“苹果树”的结果。因此，它将从你的例子中返回#5，但对于诸如“他住在苹果树附近”和“苹果树是她院子里最大的树”这样的短语，它也会返回正确的答案。