Javascript 自定义两列typeahead.js

是否可以使用两列实现真正自定义的typeahead.js布局

我正在实现一个人员查找。如果找不到此人或此人类型错误，我希望用户能够选择该选项。typeahead下拉列表可能如下所示：

jo
--------------------------------
| Joe     | Not found          |
| John    | Wrong type         |
| Joseph  | Some other problem |
| Jose    |                    |
--------------------------------

当用户键入“jo”时，会有一个匹配人员的列表，他们可以向下箭头并按enter键选择一个。或者用户可以向右箭头指向右侧列，向下箭头指向相应的问题，然后按enter键

这可能吗？在typeahead js文档中，我看到的只是每个选项都有一个自定义模板的功能，而不是有多个列。

这是用于呈现的模板。这就是你要找的吗

$('#custom-templates .typeahead').typeahead(null, {
  name: 'best-pictures',
  display: 'value',
  source: bestPictures,
  templates: {
    empty: [
      '<div class="empty-message">',
        'unable to find any Best Picture winners that match the current query',
      '</div>'
    ].join('\n'),
    suggestion: Handlebars.compile('<div><strong>{{value}}</strong> – {{year}}</div>')
  }
});

$（'#custom templates.typeahead'）.typeahead（null{
名称：“最佳影片”，
显示：“值”，
资料来源：bestPictures，
模板：{
空的：[
'',
“找不到任何与当前查询匹配的最佳图片获奖者”，
''
].join（'\n'），
建议：handlebar.compile（“{{{value}}-{{year}}”）
}
});

typeahead下拉列表应该是一个div，就像其他任何div一样（我想），难道不能像其他div一样使用css进行样式设置吗？据我所知，每个条目都是一个div，但我不清楚如何将下拉列表作为一个整体进行样式设置。我想，应该有另一个包含父div的地方。。如果没有，您也可以添加和自定义它，但这可能会很棘手，因为您将以某种方式分叉lib。有可能创建一个JSFIDLE吗？这样就更容易更新它并提供正确的答案：）这只是一列。自定义模板仅适用于单行。