Question

我的HTML中有一个select元素：

<select id="dropdown">
    <option value="1">First</option>
    <option value="2">Second</option>
</select>

它呈现为一个下拉菜单，当用户点击它时，（惊喜！）会下降。为了使页面仅通过键盘使用，我希望这样做，以便当用户按下某个键时菜单会下降。

$('body').keypress(function(event) {
    var key = String.fromCharCode(event.which);
    if (key == 'a') {
        $('#dropdown').doSomething(); // ?
    }
});

我发现最好的是调用focus()。它允许通过键盘选择值，但不会下拉菜单。有没有办法让菜单下拉？

Answer 1

使用Chrome浏览器（28.0），您可以强制执行以下鼠标事件：

var e = document.createEvent("MouseEvents");
e.initMouseEvent("mousedown", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
$("#dropdown").get(0).dispatchEvent(e);

See this working demo 在按下'a'之前不要忘记点击正文以获得焦点

如何通过键盘激活select元素的下拉菜单？

1 个答案: