使用 Jquery 进行键盘导航答案

【问题标题】：Keyboard navigation with Jquery使用 Jquery 进行键盘导航
【发布时间】：2009-08-20 15:59:06
【问题描述】：

在 Jquery 中，如何设置一个事件，当用户浏览一些图片并按下左/右箭头键时，它会调用一个可用于显示上一张/下一张照片的函数？我只需要知道如何检查按下的键是否是右/左箭头键并忽略所有其他按键。

图像将在自己的 div 中。\

【问题讨论】：

【解决方案1】：

我以前用过这个。它适用于我使用过的环境（带有 FF 的 linux 和 windows）

$(document).keypress( function(e) { 
  if (e.keyCode === 37) {
     // left
  }
  else if (e.keyCode === 39) {
     // right
  }
});

话虽如此，我不太确定在箭头键上连接是一个好主意，因为用户可以更改文本大小并导致出现滚动条。箭头会意外地改变画面。

【讨论】：

【解决方案2】：

像这样使用 jQuery 按键事件：

$("input").keypress(function (e) {
  if (e.which == 32 || (65 <= e.which && e.which <= 65 + 25)
                    || (97 <= e.which && e.which <= 97 + 25)) {
    var c = String.fromCharCode(e.which);
    $("p").append($("<span/>"))
          .children(":last")
          .append(document.createTextNode(c));
  } else if (e.which == 8) {
    // backspace in IE only be on keydown
    $("p").children(":last").remove();
  }
  $("div").text(e.which);
});

我不确定 left/right 会出现哪个值，但稍微尝试一下这个脚本应该会让你开始

【讨论】：