Bootstrap输入下拉菜单键盘箭头

Question

我正在进行一个无障碍项目，使用基于Bootstrap的组合框（输入+下拉菜单）。 在v3.3.0和v3.3.1之间，bootstrap的dropdown.js部分发生了更改，这破坏了我的代码。 当焦点在“input”上时，向上或向下的键盘箭头以前会触发下拉菜单，这正是我想要的，因为目标是实现仅键盘导航，但现在不再起作用。 当我进行比较时：

https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.js

并且

https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.js

这个变化是从 (3.3.0, 第798行) 开始的

Dropdown.prototype.keydown = function (e) {
if (!/(38|40|27|32)/.test(e.which)) return

到（3.3.1，第799行）

Dropdown.prototype.keydown = function (e) {
if (!/(38|40|27|32)/.test(e.which) || /input|textarea/i.test(e.target.tagName)) return

所以，我知道我可能可以用jQuery解决它，但这个改变有真正的理由吗？如果没有，这可以被视为一个错误报告。

以下是我的小部件的Bootply演示。适用于Bootstrap 3.3.0及以下版本，但如果您将Bootstrap版本更改为3.3.0以上的任何版本，则不会响应箭头键。

http://www.bootply.com/2gHt0MWRWd

- Nalmar

---

我自己也想知道... - bbh

Answer 1

目前有一场关于此事的持续辩论，作为登录问题15757。

这个调整是在pull #15088 (Dropdown: Ignore keydown events coming from inputs and textareas)中进行的。他们在发布中没有说明为什么需要这样做，但经过一些挖掘，我找到了涉及一些开发人员和Bootstrap团队的问题/辩论。

在那场辩论中，提到它被添加：

"以允许在下拉菜单中输入空格"

他们仍在进行头脑风暴，所以我建议您在辩论中加入自己的意见。希望这可以帮助到您。

- cfnerd

Answer 2

这是一个解决方法：

$('[data-toggle="dropdown"]').keydown(function(e){
  if(e.which == 40){
    $(this).dropdown('toggle');
  }
});

这只是检查向下箭头（键码40）

在此处查看它的实际效果

- Ted