我正在使用 jQuery 1.12。我的页面上有几个样式选择菜单。当一个处于事件状态时，我希望能够按“Tab”，然后将焦点转移到下一个样式选择菜单。我正在尝试这个
return $('div.select-styled:first').keydown(function(e) {
alert("key pressed");
if (e.which === 9) {
$('div.select-styled.active').each(function() {
return $(this).removeClass('active').next('ul.select-options').hide();
});
return $('div.select-styled:second').focus().click();
}
});
但什么也没有发生。你可以从我的 Fiddle 中看到 — http://jsfiddle.net/cwzjL2uw/5/ ，您可以在姓氏字段上单击“Tab”并激活第一个样式选择菜单，但随后再次单击“Tab”不会执行任何操作。如何从我的样式化选择菜单中捕获按键事件？
最佳答案
样式化的 select 元素是通过 div 元素实现的，除非具有 tabindex 属性，否则无法获得焦点。如果你想让一个元素变得可聚焦，你可以将 tabindex 设置为 -1。
对于您的代码，wrapper 可以设置如下:
var $wrapper = $("<div />", {
'class': "select",
'tabindex': '-1'
})
那么您的代码可能会按您的预期工作。
但是，tab focus已经是borwser提供的一个基本功能，这意味着你应该监听而不是监听tab键事件
focus 和 blur 事件并更新控件的表示。在这种情况下，您应该将tabindex 设置为1，并添加事件处理程序。
然后您可以删除 keydown 事件监听器以及 body 上的监听器以检测失去焦点。
这是您可以检查的更新后的 fiddle : JS Fiddle
另见:
关于jquery - 当焦点位于样式化的 DIV 上时，如何捕获按键？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41390350/