Twitter Typeahead.js:显示点击/焦点时的所有选项

Question

我在自动完成文本输入中使用Typeahead.js,这很棒.但是当输入获得焦点时,我需要使用所有可用选项激活下拉菜单.我见过的每一个可能的解决方案都涉及用一些值初始化输入,但我需要显示所有选项.

我怎么能实现这个目标？

Answer 1

任何回答都说"minLength:0就是你所需要的",这不是正确的.

"开箱即用"Typeahead v0.11.1'确实需要'minLength设置为0,但是如果你使用开箱即用的Bloodhound Engine,那么你需要确保设置

identify: function(obj) { return obj.team; },

在您的Bloodhound对象..

你还需要一个"中间人"功能来处理你的"空查询",这是你要告诉Bloodhound合作的地方.

function nflTeamsWithDefaults(q, sync) {
  if (q === '') {
    sync(nflTeams.all()); // This is the only change needed to get 'ALL' items as the defaults
  } else {
    nflTeams.search(q, sync);
  }
}

你可以在这里看到完整的例子..

var nflTeams = new Bloodhound({
  datumTokenizer: Bloodhound.tokenizers.obj.whitespace('team'),
  queryTokenizer: Bloodhound.tokenizers.whitespace,
  identify: function(obj) { return obj.team; },
  prefetch: '../data/nfl.json'
});

function nflTeamsWithDefaults(q, sync) {
  if (q === '') {
    sync(nflTeams.all()); // This is the only change needed to get 'ALL' items as the defaults
  }

  else {
    nflTeams.search(q, sync);
  }
}

$('#default-suggestions .typeahead').typeahead({
  minLength: 0,
  highlight: true
},
{
  name: 'nfl-teams',
  display: 'team',
  source: nflTeamsWithDefaults
});

更具体地说,您可以在以下地址看到关于焦点示例的官方TWTTER TYPEAHEAD默认建议,从.get()到.all()的简单更改(见上文或下文)

http://twitter.github.io/typeahead.js/examples/#default-suggestions

...希望这有助于某人,因为我花了一些时间来查找这些信息(通过跟踪所有错误报告并尝试找到.all()方法找到它)...

Answer 2

您需要使用该选项 minLength: 0

注意:

有一个拉取请求解决了这个问题

Answer 3

我对10.2进行了快速修改,使得此处的 "基础"示例显示在焦点上.

我更改了mixin _onFocus(第1459行)FROM:

_onFocused: function onFocused() {
    this.isActivated = true;
    this.dropdown.open();
},

至:

_onFocused: function onFocused() {
    this.isActivated = true;
    var val = this.input.getInputValue(); 
    var query = Input.normalizeQuery(val);
    this.dropdown.update(query);
    this.dropdown.open();
},

它几乎不是正式的,但它完成了工作.