Jquery TokenInput 初始字符串搜索

Question

我正在使用 jquery Tokeninput 库来实现自动完成功能。我目前正在努力解决搜索结果的问题。当我输入一些东西时，它 return 是正在输入的字符的所有单词。我希望它仅 return 初始字符串匹配的搜索结果。

例如，如果我输入"Na"，它return是所有包含“Na”的单词，例如"Canada"， "Financial"等

我只想 return 以“Na”开头的单词，例如“Nation” , "Nascar"等

我是 JavaScript 的新手，在更新此脚本时遇到问题。有人可以帮忙吗？

这是我使用的库 - https://github.com/loopj/jquery-tokeninput/blob/master/src/jquery.tokeninput.js

    $("#demo-input").tokenInput([
  {id: 7, name: "Canada"},
  {id: 11, name: "Financial "},
  {id: 13, name: "Nation"},
  {id: 17, name: "Nascar"},
  {id: 19, name: "USA"},
  {id: 31, name: "Economics"}
]);

Answer 1

我检查了库代码，我认为您不能传递任何选项来更改默认搜索类型，该类型检查值中是否存在搜索查询。但是，我发现了一个你可以使用的东西（IMO 你不应该除非必要）。

工作示例here

库允许您使用 onResult 和 onCachedResult 回调来处理搜索结果，您可以将其用作杠杆。

$("#demo-input").tokenInput([
  {id: 7, name: "Canada"},
  {id: 11, name: "Financial "},
  {id: 13, name: "Nation"},
  {id: 17, name: "Nascar"},
  {id: 19, name: "USA"},
  {id: 31, name: "Economics"}
], 
{
    onResult: filterSearchResults,
    onCachedResult: filterSearchResults
});

function filterSearchResults(items){
    var query = $("#demo-input").parent().find("ul li input").val().toLowerCase();
    return items.filter(i => i.name.toLowerCase().startsWith(query));
}

Jquery TokenInput 初始字符串搜索

Jquery TokenInput Initial Strings Search

javascript

jquery-tokeninput