使用 jQuery 从按键移动 DOM 元素在屏幕上的位置？答案

【问题标题】：Use jQuery to move DOM element's position across the screen from a keypress?使用 jQuery 从按键移动 DOM 元素在屏幕上的位置？
【发布时间】：2011-04-08 00:46:00
【问题描述】：

我想在按下右箭头键后移动一个 DOM 元素。

元素移动的距离应该与右箭头键的长度成正比。

我在想也许我可以使用这个 jQuery 插件来找出按下右箭头键的时间，然后将某个值添加到元素的 left css 值以使其看起来像是被移动了。

但是，我不知道如何进行这项工作。最好不要使用插件，而只使用与击键有关的 jQuery 方法？我只是需要一些帮助，找出实现这一目标的最简单、最有效的方法。

谢谢！

【问题讨论】：

标签： jquery keystroke

【解决方案1】：

可能是这样的，只使用 jquery 你要移动的 div 有 ID="d"

$("body").keydown(function(e) {
    var offset = 5;
    if(e.keyCode == '39') {
        var pos = $("#d").position();
        $("#d").css('left', pos.left + offset);
    }
    else if(e.keyCode == '37') {
        var pos = $("#d").position();
        $("#d").css('left',pos.left - offset);
    }
});

注意div必须有

 position:absolute;

【讨论】：

不错！这很简洁。我将尝试扩展这种方法以使我的精灵（我正在开发某种游戏）跳跃。谢谢！