防止 typeahead.js 下拉菜单在选择时关闭答案

【问题标题】：Prevent typeahead.js dropdown from closing on select防止 typeahead.js 下拉菜单在选择时关闭
【发布时间】：2013-11-24 22:41:12
【问题描述】：

如何防止在选择项目时关闭预先输入的下拉菜单？我试过像这样使用preventDefault：

$('#q').bind('typeahead:selected',function(obj, datum, name) {  
            ...
            obj.preventDefault();
        });

但没有成功。

编辑：我已经设法通过使用 typeahead_views.js 注释的第 217-218 行构建 Typeahead 来“解决”这个问题：

  byClick && utils.isMsie() ?
       utils.defer(this.dropdownView.close) : this.dropdownView.close();

但必须有另一种方法而不修改源文件？

【问题讨论】：

标签： javascript autocomplete jquery-events typeahead.js typeahead

【解决方案1】：

遇到同样的问题，并且（非常简单的）解决方案似乎没有在任何地方记录

$(document).on('typeahead:beforeclose', function(event, data) {
  event.preventDefault()
})

（这只会阻止下拉菜单关闭，这在开发过程中非常有用，如果您想阻止仅在 selet 上关闭，请使用 'typeahead:beforeselect'）。

【讨论】：

【解决方案2】：

在关闭的回调上触发输入的焦点。

    $('#typeahead-input').on('typeahead:closed', function(e, d) {
      $('#typeahead-input').focus();
    });

【讨论】：

我发现这仍然会关闭下拉菜单。

【解决方案3】：

我正在处理 tokenfield 中的 typeahead，所以第一部分是我访问 Typeahead.dropdown 对象，这本身就需要一些搜索。

尝试玩弄isOpen 或覆盖close 函数，最后我得到的最接近的是这个。打破事件的编组。您必须重新实现值等的任何保存，基本上是 Typeahead.select 的前 3 行。

我自己无法在下拉列表中放置一个表单（焦点停留在输入字段中），如果要在其中放置一些交互式内容，我仍然需要更多的搜索。想我会在这个上自行解决，但可能会帮助那些只想阻止关闭的人，将原始函数放在 var 中，以便在完成后将其放回原处。

$('input[id="test"]').data('bs.tokenfield')
    .$input.data('ttTypeahead').dropdown.trigger = function(e) {};

这也有潜力：

$('input[id="test"]').data('bs.tokenfield')
    .$input.data('ttTypeahead').eventBus.trigger = function(e) {};

【讨论】：

【解决方案4】：

更简单的方法：

     input.data('tt-typeahead')._selectOld = input.data('tt-typeahead')._select
     input.data('tt-typeahead')._select = function(datum) {
       if (false)
         this._selectOld(datum)
     }

【讨论】：