小编Ian*_*Lin的帖子

typeahead.js提示并突出显示param无法使用prefetch和remote

我按照这里的说明用血猎犬实现了类型:http: //twitter.github.io/typeahead.js/examples/#bloodhound

这是我的HTML:

<div id="remote">
  <input class="typeahead" type="text" placeholder="Search for cast and directors"> 
</div>
Run Code Online (Sandbox Code Playgroud)

这是我的js:

$(document).ready(function() {
var castDirectors = new Bloodhound({
  datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
  queryTokenizer: Bloodhound.tokenizers.whitespace,
  prefetch: '../api/v1/search/people_typeahead',
  remote: '../api/v1/search/people_typeahead?q=%QUERY',
    dupDetector: function(remoteMatch, localMatch) {
        return remoteMatch.value === localMatch.value;
    }
});

castDirectors.initialize();

$('#remote .typeahead').typeahead(null, {
  name: 'cast-directors',
  displayKey: 'value',
  source: castDirectors.ttAdapter(),
    hint: false,
    highlight: true,
    templates: {
        empty: [
      '<div class="empty-message">',
      'No matching names',
      '</div>'
    ].join('\n'),
        suggestion: Handlebars.compile('<a id="typeahead" href="{{link}}"><p>{{value}}</p></a>')
    }       
});
});
Run Code Online (Sandbox Code Playgroud)

但是,即使提示设置为false并且突出显示设置为true,我仍然会看到提示,而不是在预先输入中获得高亮显示.我应该改变什么?

javascript jquery typeahead.js

7
推荐指数
2
解决办法
9222
查看次数

Typeahead.js带有可点击的链接

我想在我的网站上实现具有typeahead功能的搜索,并按照此处的说明操作:http: //twitter.github.io/typeahead.js/examples/#custom-templates

但是,这些示例都将typeahead显示为文本,因此onclick只填充文本框.

对我来说,修改此内容的最佳方式是什么,以便点击建议实际链接到建议的页面?例如,typeahead返回3个对象:

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

我该怎么做才能让对象1..3返回,点击它们会让用户链接1..3?

javascript typeahead.js

4
推荐指数
1
解决办法
5390
查看次数

标签 统计

javascript ×2

typeahead.js ×2

jquery ×1