jQuery: 如何检测箭头键只在特定元素上按下

Question

我是 jQuery 的新手，正在尝试找到一种方法来 检测箭头键按下（仅向上和向下）。在网上搜索这个时，我从这里看到 this post。

这看起来非常好，但我只想检测箭头键按下 当用户位于具有特定 class 的元素上时（即元素具有焦点) 动态添加到页面。

具体来说，我想在具有焦点的列表上按向上或向下箭头键时突出显示相应的列表项。

有没有一种方法可以实现并跨浏览器工作？

看起来这已经自动发生了，但在我的情况下它不能正常工作并且总是跳过列表项，这就是为什么我认为我可以单独定义它。

示例元素：

<ul class="myClass" id="someID">
   <li><a href="#">Value1</a></li>
   <li><a href="#">Value2</a></li>
   <li><a href="#">Value3</a></li>
</ul>

非常感谢您的帮助，麦克

Answer 1

而不是

$(document).keydown(function(e) {

在您的 javascript 代码中有

$(<selector>).keydown(function(e) {

其中 <selector> 指向您要跟踪的元素。

更新

更好 - 因为你提到动态添加的元素，使用事件绑定的委托结构：

$(document).on("keydown", ".<yourClassName>", function(e) {

Answer 2

您可以使用标准

$('body').keyup(function(e){...})

mechanizm 并检查当前活动元素的 class:

document.activeElement.classList

jQuery: How to detect arrow key press only on certain element