如何使用键盘箭头键分别向左/右移动div 100px

我有一个id为bottom_arrow的div，我想左/右使用我的键盘箭头左右移动div 100px。 我怎样才能做到这一点？

Answer 1

通常，按键事件会转到输入或某个具有焦点的控件，如果您通常在页面上需要它们，由于删除标准行为，有时会对此感到不满，然后将keydown事件绑定到整个文档。

 $('body').keydown(function(event) { switch (event.keycode) { case 37: // left arrow key $('#bottom_arrow').animate({ 'left': '-=100' }); break; case 39: // right arrow key $('#bottom_arrow').animate({ 'left': '+=100' }); break; } }); 

我已经使用了keydown而不是keypress因为用户希望它在按下键时触发。

Answer 2

 $('body').keydown(function(event) { switch (event.keycode) { case 37: // left arrow key $('#bottom_arrow').animate({ 'left': '-=100' }); break; case 39: // right arrow key $('#bottom_arrow').animate({ 'left': '+=100' }); break; } }); 

Answer 3

根据Jquery文档，请使用event.which。

 $('body').keydown(function(event) { switch (event.which) { case 37: // left arrow key $('#bottom_arrow').animate({ 'left': '-=100' }); break; case 39: // right arrow key $('#bottom_arrow').animate({ 'left': '+=100' }); break; } });