如果单击选择（下拉），则错过了 Keyup 事件答案

【问题标题】：Keyup Event Missed If Clicking On Select(Dropdown)如果单击选择（下拉），则错过了 Keyup 事件
【发布时间】：2018-04-18 06:34:09
【问题描述】：

我有一个页面，当用户按住一个键（在我的情况下为 [Ctrl]）时，他们能够以特定方式与页面元素进行交互。一旦他们释放密钥，并且 keyup 事件触发，我重置了一些标志。我发现，当我在按住键的同时单击选择下拉菜单时，永远不会捕获 keyup 事件。我创建了一个快速笔来演示这个问题。我不知道这是否可能是范围问题。目前我正在使用 jQuery 来像$(document).on('keyup',(e)=>{}) 一样收听，但也许选择的范围不同？我尝试了一些，但找不到一个有效的。

https://codepen.io/srm985/pen/LmPvdO

$(document).on("keydown", e => {
  if (e.keyCode == "17") {
    $("span").text("true");
  }
});

$(document).on("keyup", e => {
  if (e.keyCode == "17") {
    $("span").text("false");
  }
});

select {
  width: 250px;
  height: 35px;
}

span {
  color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Press and hold [Ctrl]. While holding [Ctrl], click on select. The keyup event is never captured.</p>
<p>Key Down: <span>false</span></p>
<select>
  <option>test1</option>
  <option>test2</option>
</select>

【问题讨论】：

这很有趣。我尝试将选择器更改为window 和'*'，行为相同。
我不是很喜欢解决方法，但我认为这种行为与 select box 本身有关 --- 您可能需要使用 divs ul li 重新创建选择框等等等等..这是一个有趣的问题。
jQuery keypress/keyup/etc events not fired when select box is expanded的可能重复
这是一个已知的错误，目前除了使用其他 html 元素模拟选择之外没有其他解决方案：bugs.chromium.org/p/chromium/issues/detail?id=336710

标签： javascript jquery html

【解决方案1】：

这是 chrome 中的一个已知错误：https://bugs.chromium.org/p/chromium/issues/detail?id=336710

目前，唯一现实的解决方案是给您的选择一个 size 属性 > 1（这使得它不是下拉列表，而是一个列表），或者使用类似 https://select2.org/ 的东西来模拟选择。

【讨论】：