alt 按键上的 focusout 事件无法按预期工作

Question

我在我的一个项目中使用jQuery Token Input 插件和我的自定义编写插件之一。

我的插件基本上将一个锚标记添加到它被初始化的元素，并在单击锚链接时显示一个文本输入元素，该元素绑定到 jquery token input 插件。

在FocusOut 事件中，我想隐藏文本输入（在这种情况下，这将是由 jquery 令牌输入初始化的 ul，而不是文本输入）。

到目前为止一切正常。

但如果我按下 alt 键，主 ul 会按预期隐藏，但下拉菜单 ul 仍然可见。

要查看我面临的问题，您还可以查看此JSFiddle。抱歉，关于 CSS 部分，我确实包含了 CSS 文件，但由于某种原因它无法按预期工作。

现在，在小提琴中，如果您单击 + Add 按钮，则会出现输入和下拉菜单（带有说明），然后如果您单击预览窗口中的其他任何位置，它就会消失，这是预期的行为。

但是，如果您单击添加按钮并且一旦出现输入和下拉菜单，然后如果您按下 alt 键（这会启动 focusout 事件），则输入会消失，但下拉菜单仍会显示。这是为什么呢？

这可能是什么原因造成的？

更新：

如果我让事情变得有点复杂，我深表歉意。以下是预期行为与问题之间的比较。

案例 1：（点击正文中某处触发的 focusout 事件）。

在这种情况下，用户单击 +Add 按钮 > 出现一个带有打开下拉列表的输入框 > 用户通过单击正文中的其他位置来集中注意力 > 输入和下拉列表消失。

这是预期的行为。

案例 2：（在alt 按键上触发了焦点事件）。

在这种情况下，用户单击 +Add 按钮 > 出现一个带有打开下拉列表的输入框 > 用户按下触发聚焦事件的 alt 键 > 输入消失但下拉列表没有。

我需要确保下拉菜单在这种情况下也消失。

注意：由于某种原因，Dropdown CSS 在小提琴中搞砸了。显示type somethig 的文本是下拉元素。

Answer 1

添加快捷方式库并添加以下代码。有效

shortcut.add("Alt", function() {
   $('.token-input-dropdown').hide()
        });

演示：http://jsfiddle.net/abdennour/dHSWu/5/

同样，请远离使用margin的标签以避免事件重叠

a.addInput{
    margin:2px;
}
div.token-input-dropdown{
     margin:2px;
}