在JS / jQuery中绑定箭头键
如何在Javascript和/或jQuery中将函数绑定到左右箭头？ 我查看了jQuery的js-hotkey插件（包装内置绑定函数以添加一个参数来识别特定的键），但似乎并不支持箭头键。
$(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) {
（编辑2017）
如果你觉得奇怪，你可以使用e.key而不是e.which或e.keyCode 。 e.key正在成为推荐的标准，允许您检查字符串： 'ArrowLeft' ， 'ArrowUp' ， 'ArrowRight' ， 'ArrowDown' 。 新的浏览器本地支持它， 请点击这里 。
$(document).keydown(function(e){ if (e.keyCode == 37) { alert( "left pressed" ); return false; } });
字符代码：
37 – 离开
38岁以上
39 – 对
40下来
您可以使用箭头键的keyCode（左，上，右和下）分别为37,38,39和40：
$('.selector').keydown(function (e) { var keyCode = e.keyCode || e.which, arrow = {left: 37, up: 38, right: 39, down: 40 }; switch (keyCode) { case arrow.left: //.. break; case arrow.up: //.. break; case arrow.right: //.. break; case arrow.down: //.. break; } });
检查上面的例子。
这有点晚，但HotKeys有一个非常重要的bug，如果你给一个元素附加了多个热键的话，会导致事件被多次执行。 只要使用普通的jQuery。
$(element).keydown(function(ev) { if(ev.which == $.ui.keyCode.DOWN) { // your code ev.preventDefault(); } });
我简单地结合了其他答案中的最佳位：
$(document).keydown(function(e){ switch(e.which) { case $.ui.keyCode.LEFT: // your code here break; case $.ui.keyCode.UP: // your code here break; case $.ui.keyCode.RIGHT: // your code here break; case $.ui.keyCode.DOWN: // your code here break; default: return; // allow other keys to be handled } // prevent default action (eg. page moving up/down) // but consider accessibility (eg. user may want to use keys to choose a radio button) e.preventDefault(); });
你可以使用KeyboardJS。 我就这样写了图书馆的任务。
KeyboardJS.on('up', function() { console.log('up'); }); KeyboardJS.on('down', function() { console.log('down'); }); KeyboardJS.on('left', function() { console.log('right'); }); KeyboardJS.on('right', function() { console.log('left'); });
在这里签出图书馆=> http://robertwhurst.github.com/KeyboardJS/
你确定jQuery.HotKeys不支持箭头键吗？ 我已经搞砸了他们的演示之前，观察左，右，上，下工作，当我在IE7，Firefox 3.5.2和谷歌浏览器2.0.172测试…
编辑 ：它出现jquery.hotkeys已被重新分配到Github： https ： //github.com/jeresig/jquery.hotkeys
简洁的Javascript解决方案（感谢Sygmoral提供的改进）：
document.onkeydown = function(e) { switch (e.keyCode) { case 37: alert('left'); break; case 39: alert('right'); break; } };
而不是使用return false; 如上面的例子，你可以使用e.preventDefault(); 它做同样的事情，但更容易理解和阅读。
你可以使用jQuery绑定：
$(window).bind('keydown', function(e){ if (e.keyCode == 37) { console.log('left'); } else if (e.keyCode == 38) { console.log('up'); } else if (e.keyCode == 39) { console.log('right'); } else if (e.keyCode == 40) { console.log('down'); } });
你可以检查一个arrow key是否被按下：
$(document).keydown(function(e){ if (e.keyCode > 36 && e.keyCode < 41) { alert( "arrowkey pressed" ); return false; } });
单纯的向右或向左的js的例子
window.addEventListener('keydown', function (e) { // go to the right if (e.keyCode == 39) { } // go to the left if (e.keyCode == 37) { } });
防止箭头只适用于其他任何对象SELECT，实际上我还没有测试另一个对象LOL。 但它可以停止页面上的箭头事件和输入类型。
我已经尝试阻止左右箭头在“keydown”和“keyup”事件上使用“e.preventDefault（）”或“返回false”来更改SELECT对象的值，但仍会更改对象值。 但事件仍然告诉你，箭头被按下。
用于捕获键盘输入和组合键的健壮的Javascript库。 它没有依赖关系。
http://jaywcjlove.github.io/hotkeys/
hotkeys('right,left,up,down', function(e, handler){ switch(handler.key){ case "right":console.log('right');break case "left":console.log('left');break case "up":console.log('up');break case "down":console.log('down');break } });
我来这里寻找一种简单的方法，让用户在专注于输入时，使用箭头键+1或-1输入一个数字。 我从来没有找到一个好的答案，但提出了以下代码似乎很好 – 现在使这个网站。
$("input").bind('keydown', function (e) { if(e.keyCode == 40 && $.isNumeric($(this).val()) ) { $(this).val(parseFloat($(this).val())-1.0); } else if(e.keyCode == 38 && $.isNumeric($(this).val()) ) { $(this).val(parseFloat($(this).val())+1.0); } });
用咖啡和Jquery
$(document).on 'keydown', (e) -> switch e.which when 37 then console.log('left key') when 38 then console.log('up key') when 39 then console.log('right key') when 40 then console.log('down key') e.preventDefault()
