如何在 JavaScript 和 jQuery 中捕获箭头击键？

使用 JS 和 jQuery 捕获箭头键

将函数绑定到 Javascript 和 jQuery 中的箭头键是键盘导航的常见要求。虽然 jQuery 的 js-hotkey 插件扩展了内置绑定功能，但它缺乏对箭头键的支持。

为了解决这个问题，这里有一个简单的解决方案：

<code class="javascript">document.onkeydown = function(e) {
    switch(e.which) {
        case 37: // left
        break;

        case 38: // up
        break;

        case 39: // right
        break;

        case 40: // down
        break;

        default: return; // exit this handler for other keys
    }
    e.preventDefault(); // prevent the default action (scroll / move caret)
};</code>

此代码捕获使用 switch 语句的左、上、右和下箭头键的击键。您可以在每种情况下定义所需的操作。

请注意，对于不支持which属性的浏览器（例如IE8），请修改函数体如下：

<code class="javascript">document.onkeydown = function(e) {
    e = e || window.event;
    switch(e.which || e.keyCode) {
        case 37: // left
        break;

        // ...
    }
};</code>

或者，对于现代浏览器，KeyboardEvent.key 属性可用于检测箭头键，如下例所示：

<code class="javascript">document.onkeydown = function(e) {
    switch(e.key) {
        case "ArrowLeft": // left
        break;

        // ...
    }
};</code>

通过实现此代码，您可以轻松地将函数绑定到 JavaScript 中的箭头键或 jQuery 应用程序。

以上是如何在 JavaScript 和 jQuery 中捕获箭头击键？的详细内容。更多信息请关注PHP中文网其他相关文章！