JS/jQuery中的绑定箭头键

Question

JS/jQuery中的绑定箭头键如何将函数绑定到Javascript和/或jQuery中的左右箭头键？我查看了jQuery的js热键插件(包装内置的绑定函数以添加参数以识别特定的键)，但它似乎不支持箭头键。

Answer 1

$(document).keydown(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)});

将箭头键的自定义代码放在相应的case和break台词。

e.which是由jQuery标准化的，所以它在所有浏览器中都能工作。对于纯javascript方法，将前两行替换为：

document.onkeydown = function(e) {
    e = e || window.event;
    switch(e.which || e.keyCode) {

如果你觉得喜欢，你可以用e.key而不是e.which或e.keyCode现在。e.key正在成为推荐的标准，允许您检查字符串：'ArrowLeft', 'ArrowUp', 'ArrowRight', 'ArrowDown'..新浏览器本机支持它，检查这里.

Answer 2

$(document).keydown(function(e){
    if (e.which == 37) { 
       alert("left pressed");
       return false;
    }});

字符代码：

37-左

38岁以上

39-权利

四十下

Answer 3

您可以使用箭头键的键码(左、上、右和下分别为37、38、39和40)：

$('.selector').keydown(function (e) {
  var arrow = { left: 37, up: 38, right: 39, down: 40 };

  switch (e.which) {
    case arrow.left:
      //..
      break;
    case arrow.up:
      //..
      break;
    case arrow.right:
      //..
      break;
    case arrow.down:
      //..
      break;
  }});

检查上面的示例这里.