JavaScript：使<select onchange =“”>或<option onclick =“”>键盘可访问

Question

之前已经提出过类似的问题，但是我正在寻找相反的问题＆＃34;解决方案比其他所有;-) 我需要一个JavaScript事件，当用户决定选择字段中的选项时会触发该事件。 决定我的意思是什么： 鼠标：单击以展开选择，然后单击以选择任何选项。 键盘：要么： 按向上/向下键以＆＃34;滚动＆＃34;通过选项（不扩展选择），然后按ENTER / TAB键进行选择。要么： 按ALT + DOWN展开选择，然后使用向上/向下键滚动选项，最后按ENTER / TAB键选择。 到目前为止我找到的非完美解决方案： 点击每个选项：Firefox＆amp; Internet Explorer：适用于鼠标，但不适用于键盘。 Chrome：根本不起作用。 选择onchange：Firefox：按预期工作。 Chrome＆amp; Internet Explorer：仅使用向上/向下键（而不扩展选择）时过早触发：在用户＆＃39;记住，他们只是滚动浏览可用的选项，而不是实际选择任何东西。 虽然很受欢迎，但这种做法违反了WCAG：http：//www.w3.org/TR/2012/NOTE-UNDERSTANDING-WCAG20-20120103/consistent-behavior-unpredictable-change.html onblur on the select：Firefox＆amp; Chrome＆amp; Internet Explorer：只有在实际离开选择时才会触发太晚。 选择onkeydown，再加上评估keyCode：看起来对我来说很麻烦，因为可能有（或结果）其他方式来确认某些东西，而不是按ENTER键（可能在移动设备上）。 我发现的唯一具有完美可访问性的解决方案是丑陋的： 有一个显式的提交按钮并将事件绑定到此。 所以（最后）我的问题是：如果没有提交按钮，你知道其他任何方法吗？

Answer 1

您可以使用the onInput event：

  

当input，<input>或<select>元素的值发生更改时，会同步触发DOM <textarea>事件。

现在，Firefox doesn’t support the event on <select> elements，但由于onChange在Firefox中的效果与您相同，因此您可以进行选择。 （无论如何，你想要backwards compatibility的onChange听众。）