Javascript 在引导标记字段中插入标记后调用自动完成下拉列表

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

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

默认情况下，在选择一个标记后，输入仍将被聚焦，只有当我将焦点向外和向内聚焦到输入字段时，自动完成才会再次自动弹出

我想能够重新打开自动完成选项，一旦我输入了令牌

我想尝试使用

tokenfield:createtoken

事件来再次丢失并获得输入的焦点，但这不会给出autocomplete下拉列表

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

另一个想法是尝试使用

搜索

功能自动完成用户界面

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

那也不走运。

---

请帮忙！谢谢

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

因此，您需要setTimeout才能使其正常工作：

---

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

来自aeryaguzov的回答，稍加修改（我需要添加一个单击，以便能够在打开后第一次单击时进行选择） 它工作得很好，但仍然是一个解决办法

我们欢迎更好的解决方案

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

---

对于解决方案，它的效果比预期的要好。对于这一点，它仍然感觉一定是一个更好的解决方案。当弹出窗口打开时，下一次单击将被自动完成导入，只需第二次单击即可进行选择。在弹出窗口打开后添加一次单击将在第一次单击自动完成时将其设置为工作状态。：）

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