Javascript 返回关联结果的typeahead方法

我不确定这个标题是否恰当，但我需要做的理论上相当简单。我过去曾使用Twitter的

typeahead.js

从预定义列表中查找值。但是，现在我需要根据用户键入的内容返回一些内容，而不是用户键入的内容

我有一个名称和ID的列表-用户将知道名称，但不知道ID。当他们输入名称时，下拉列表需要下拉与该名称关联的任何ID

typeahead.js框架是否适用于此？如果是，我该怎么做？我在网上找不到任何文档（或者我不知道搜索什么…）

我的JSON将如下所示：

    {
    "1": {
        "name": "John",
        "ID": "1234"
    },
   "2": {
        "name": "Bob",
        "ID": "2345"
    },
   "3": {
        "name": "Matt",
        "ID": "3456"
    },
   "4": {
        "name": "John",
        "ID": "9874"
    }
}

因此，如果用户键入“John”，我希望下拉列表返回两个值：

1234
9874

---

如果typeahead.js没有这个功能，我并不反对使用它以外的东西。

typeahead.js仍然是一个很好的选择

下面是一个工作示例：

var substringMatcher=函数（strs）{
返回函数findMatches（q，cb）{
var匹配，substringRegex；
匹配项=[]；
substregex=新的RegExp（q，‘i’）；
$。每个（str，功能（i，str）{
if（substrRegex.test（str.name））{
匹配。推（str）；
}
});
cb（比赛）；
};
};
var people=[{
“姓名”：“约翰”，
“ID”：“1234”
},{
“姓名”：“鲍勃”，
“ID”：“2345”
},{
“姓名”：“马特”，
“ID”：“3456”
},{
“姓名”：“约翰”，
“ID”：“9874”
}];
$（'#custom templates.typeahead'）.typeahead（null{
姓名：'人'，
显示：“ID”，
资料来源：substringMatcher（人），
模板：{
空的：[
'',
“找不到任何结果。”，
''
].join（'\n'），
建议：handlebar.compile（{{ID}}}）
}
});

您只需要添加自定义模板

例如：

---

具体来说，请查看自定义模板，非常感谢Kyle。我会调查此事，如果我有任何问题，会告诉你的！

var substringMatcher = function(strs) {
 return function findMatches(q, cb) {
   var matches, substringRegex;
   matches = [];
   substrRegex = new RegExp(q, 'i');
   $.each(strs, function(i, str) {
     if (substrRegex.test(str.name)) {
       matches.push(str);
     }
   });
   cb(matches);
 };
};

var people = [{
    "name": "John",
    "ID": "1234"
},{
    "name": "Bob",
    "ID": "2345"
},{
    "name": "Matt",
    "ID": "3456"
},{
    "name": "John",
    "ID": "9874"
}];

$('#custom-templates .typeahead').typeahead(null, {
  name: 'people',
  display: 'ID',
  source: substringMatcher(people),
  templates: {
    empty: [
      '<div class="empty-message">',
       'unable to find any results.',
       '</div>'
     ].join('\n'),
   suggestion: Handlebars.compile('<div>{{ID}}</div>')
  }
});