检测JavaScript中的方向键

我如何检测当一个方向键被按下?我用这个找到了答案:

function checkKey(e) {
    var event = window.event ? window.event : e;
    console.log(event.keyCode)
}

虽然它适用于所有其他键，但它不适用于方向键(可能是因为浏览器默认情况下应该在这些键上滚动)。

当前回答

对于不可打印的键，如方向键，使用向下键，而不是按下键:

function checkKey(e) {
    e = e || window.event;
    alert(e.keyCode);
}

document.onkeydown = checkKey;

我找到的最好的JavaScript键事件参考资料(例如，打败quirksmode)在这里:http://unixpapa.com/js/key.html

2011-04-08 15:39:53

其他回答

我已经能够用jQuery捕获它们:

$(document).keypress(function (eventObject) {
    alert(eventObject.keyCode);
});

示例:http://jsfiddle.net/AjKjU/

2011-04-08 15:14:46

可能是最简洁的表述:

document.onkeydown = function(e) {
    switch (e.keyCode) {
        case 37:
            alert('left');
            break;
        case 38:
            alert('up');
            break;
        case 39:
            alert('right');
            break;
        case 40:
            alert('down');
            break;
    }
};

演示(感谢用户Angus Grant): http://jsfiddle.net/angusgrant/E3tE6/

这应该可以跨浏览器工作。如果有浏览器无法使用，请留下评论。

还有其他方法来获取键代码(e.c iwhich, e.c arcode和window。事件而不是e)，但它们不应该是必要的。你可以在http://www.asquare.net/javascript/tests/KeyCode.html上尝试其中的大部分。注意这个事件。keycode在Firefox中不与onkeypress一起工作，但它与onkeydown一起工作。

2013-07-29 16:16:16

方向键只能由onkeydown触发，而不是onkeypress。

键码是:

左= 37 Up = 38 右= 39 下降= 40

2011-04-08 15:13:52

这是短的。

函数IsArrows (e) { return (e.keyCode >= 37 && e.keyCode <= 40); ｝

2014-11-18 07:39:30

这是chrome和firefox的工作代码

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>

<script type="text/javascript">

    function leftArrowPressed() {
      alert("leftArrowPressed" );
      window.location = prevUrl  
    }

    function rightArrowPressed() {
      alert("rightArrowPressed" );
      window.location = nextUrl  
    }
    function topArrowPressed() {
      alert("topArrowPressed" );
      window.location = prevUrl  
    }

    function downArrowPressed() {
      alert("downArrowPressed" );
      window.location = nextUrl  
    }

        document.onkeydown = function(evt) {
                        var nextPage = $("#next_page_link")
                        var prevPage = $("#previous_page_link")
                        nextUrl = nextPage.attr("href")
                        prevUrl = prevPage.attr("href")
        evt = evt || window.event;
        switch (evt.keyCode) {
                case 37:
                leftArrowPressed(nextUrl);
                break;

                case 38:
                topArrowPressed(nextUrl);
                break;

                 case 39:
                rightArrowPressed(prevUrl);
                break;

                case 40:
                downArrowPressed(prevUrl);
                break;

        }
    };


</script>
</head>
<body>
<p>
<a id="previous_page_link" href="http://www.latest-tutorial.com">Latest Tutorials</a> 
<a id="next_page_link" href="http://www.zeeshanakhter.com">Zeeshan Akhter</a>
 </p>
</body>
</html>

2013-12-10 20:31:34

检测JavaScript中的方向键

推荐文章

最新文章

标签