4

我有一个像这个Fiddle这样的小例子。使用自动完成的简单引导令牌输入。

$(document).ready(function() {   
    $('#tokenfield').tokenfield({
      autocomplete: {
        source: ['red','blue','green','yellow','violet','brown','purple','black','white'],
        delay: 100
      },
      showAutocompleteOnFocus: true
    });
});

默认情况下，在选择一个标记后，输入仍然会被聚焦，并且如果我将注意力集中在输入字段中，自动完成只会再次自动弹出。

输入令牌后，我希望能够重新打开自动完成选项。

我正在考虑尝试使用该tokenfield:createtoken事件来失去并再次获得输入焦点，但这不会给出自动完成下拉菜单。

$('#tokenfield').on('tokenfield:createtoken', function (e) {
   console.log('FOCUS IN AND OUT');
   $('#tokenfield-tokenfield').blur();
   $('#tokenfield-tokenfield').focus();
});

另一个想法是尝试使用search函数 autocomplete-ui。

$('#tokenfield').on('tokenfield:createtoken', function (e) {
    console.log('TRY AUTOCOMPLETE SEARCH');
    $('#tokenfield-tokenfield').autocomplete('search', '');
});

也没有运气。请帮忙！谢谢！JSFiddle 这里

4

2 回答 2

3

您的代码不起作用，因为在关闭自动完成窗口之前触发了事件。

所以你需要setTimeout让它工作：

JSFiddle 上的示例

setTimeout(function() {
  $('#tokenfield-tokenfield').blur();
  $('#tokenfield-tokenfield').focus()
}, 0)

正如您在示例中看到的，设置令牌后，自动完成窗口会立即关闭并再次打开。

于 2015-11-27T05:13:30.673 回答
1

从 aeryaguzov 的回答中稍作修改（我需要添加一个单击才能在打开后第一次单击时选择）它工作正常，但它仍然是一种解决方法。

欢迎更好的解决方案。

$('#tokenfield').on('tokenfield:createtoken', function (e) {
      setTimeout(function() {
            $('#tokenfield-tokenfield').blur();
            $('#tokenfield-tokenfield').focus();
            $('#tokenfield-tokenfield').click();
      }, 0)
});

在这里提琴

于 2015-11-27T06:04:10.830 回答