带有可点击链接的 Typeahead.js

我想在我的网站上实现带有预先输入功能的搜索，并按照此处的说明进行操作：http://twitter.github.io/typeahead.js/examples/#custom-templates

但是，这些示例都将预输入显示为文本，因此 onclick 仅填充文本框。

对我来说，修改此设置以便 onclick 建议实际上链接到建议页面的最佳方法是什么？例如。 typeahead 返回 3 个对象：

• 对象 1：链接 1
• 对象 2：链接 2
• 对象 3：链接 3

我应该怎么做才能返回对象 1..3，并且单击它们会使用户链接到 1..3？

写一个简单的例子http://jsfiddle.net/2RNFj/3/

您只需提供对象并将其提供给Bloodhound设置来源typehead:

var links = [{name: "abc", link: "http://www.example1.com"}, 
             {name: "nbc", link: "http://www.example2.com"}];

var source = new Bloodhound({
  datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
  queryTokenizer: Bloodhound.tokenizers.whitespace,
  local: links
});

source.initialize();

$('#custom-templates .typeahead').typeahead(null, {
  name: 'matched-links',
  displayKey: 'name',
  source: source.ttAdapter(),
  templates: {
    empty: [
      '<div class="empty-message">',
      'unable to find any Best Picture winners that match the current query',
      '</div>'
    ].join('\n'),
      suggestion: Handlebars.compile('<p><a href="{{link}}">{{name}}</a></p>')
  }
});