键盘导航以加载页面答案

【问题标题】：Keyboard Navigation to load pages键盘导航以加载页面
【发布时间】：2010-09-22 20:11:05
【问题描述】：

有没有一种快速的方法来使用左右箭头键来加载下一页？到目前为止，我的解决方案是：

$(document).ready(function () {
    $("a.transition").click(function (event) {
        event.preventDefault();
        linkLocation = this.href;
        $("body").fadeOut(20, redirectPage);

    });
    $("a.transitionB").click(function (event) {
        event.preventDefault();
        linkLocation = this.href;
        $("body").fadeOut(20, redirectPage);

    });
    function redirectPage() {
        window.location = linkLocation;
    }
});

带有 2 个不可见的链接层。但我需要一些东西来控制过渡而不点击页面，而是使用箭头按钮。

感谢您的帮助。

【问题讨论】：

标签： jquery keyboard-events

【解决方案1】：

试试这个（不同的浏览器 == 不同的键码）：

function redirectPage(href) {
    window.location = href;
}

function onKey(e) {
    var key = e.keyCode ? e.keyCode : e.which;

    if (key == 37 || key == 26) {
        e.preventDefault();
        $("a.transition").click();
    } else if (key == 39 || key == 27) {
        e.preventDefault();
        $("a.transitionB").click();
    }
}

$(document).ready(function () {
    $(document).keypress(onKey);
    $("a.transition, a.transitionB").click(function (event) {
        event.preventDefault();
        $("body").fadeOut(20, function() {redirectPage(this.href)});
    });
});

【讨论】：

【解决方案2】：

$(document).keyup(function(e) {
    console.log(e.keyCode);
});

编辑：

$(document).keyup(function(e) {
  switch(e.keyCode) {
    case 37 : alert('You pressed Left'); break;
    case 38 : alert('You pressed Up'); break;
    case 39 : alert('You pressed Right'); break;
    case 40 : alert('You pressed Down'); break;
   }
});

你可以在这里试一试http://jsbin.com/uzigu4

【讨论】：