jquery-autocomplete 插件搜索

标签 jquery jquery-plugins autocomplete

有这个jquery-autocomplete插入 它允许您仅搜索确切的字符串..

所以我们可以说这就是数据..

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

现在搜索“apple”应该会显示所有内容。

但是当输入“苹果树”时,它只返回“苹果树”。
我希望它返回智能结果(2,3 和 5)。

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

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

这个插件允许您提供自己的搜索..

使我们能够智能搜索的精细化搜索是什么样的?

它需要忽略空格并将搜索查询拆分为单词以逐个评估每个单词...

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

最佳答案

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

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

执行您想要完成的任务的逻辑可能如下所示:

  1. 将通过空格 ("") 传递的结果拆分为术语数组。
  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/

关于jquery-autocomplete 插件搜索,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14042172/

相关文章:

javascript - 使用 jQuery 在边界内拖动图像

jquery - 如何循环 jQuery 序列化的数据,然后填充 div?

javascript - floatThead 和 bootstrap downdrop

javascript - jQuery UI 自动完成多个值 - 如何在空格而不是逗号后显示建议列表?

javascript - 访问 Prime UI 在自动完成中选择的项目 (pui-autocomplete)

javascript - 从二维数组中选择大量选项的最佳自动完成功能?

javascript - 删除 .clickable 类后,jQuery click() 仍然被触发

javascript - 使用 Ajax 请求 Rails Controller 数据

jquery - 如何使用 jQuery 将页面向上或向下滚动到 anchor ?

html - 停止表单输入框自动完成的正确方法是什么?