Javascript 使用箭头键移动元素jquery

有人能告诉我为什么这不起作用吗

JavaScript:

$(document).ready(function() {
        $(document).live("keydown", KeyOperation);
});

function KeyOperation(e)
{
    alert("in");
    var top = $(".move").offset().top;
    var left = $(".move").offset().left;
    var IncrementBy = 10;

    if (e.which == 37) {
        $(".move").css({ left: left - 10 });
    }
    else if (e.which == 38) {
        $(".move").css({ top: top - IncrementBy });
    }
    else if (e.which == 39) {
        $(".move").css({ left: left + IncrementBy });
    }
    else if (e.which == 40) {
        $(".move").css({ top: top + IncrementBy });
    }
}​

HTML:

---

假设问题是元素没有移动（您在问题中没有真正说明问题），原因是元素没有正确定位

将

position:absolute

或

position:relative

添加到CSS中

---

这里有一个。

您需要删除代码中的

警报

功能，并将

.live

功能替换为

.keydown

功能。

不，我们不能，因为我们甚至不知道它应该做什么。。。但是，如果你能更好地解释你的问题，例如，你想做什么，什么不起作用，那么我们可能会帮助你。我的观点：（请不要写一个好问题。“这是我的代码，请修复它”（实际上你甚至没有发布代码）这不是一个好问题。+0.5代表一个JSFIDLE，但是-0.5代表没有表现出任何努力。好的，我会记住未来的+1很好，但是我可以请你简单地回答我为什么这个css属性在这里有如此巨大的影响，我的意思是绝对的和相对的，完美的答案谢谢，顺便说一句，从这一点点的共同点上理解这个问题是不是太难了de？@shareef-只有绝对或相对定位的元素才会响应

左侧

和

顶部

属性，这正是用于移动元素的属性。@KingKong-没问题，很高兴我能帮上忙：）理解这个问题并不难，但您没有明确说明问题到底是什么。我必须通读你的代码并理解它的作用，但你真的应该在你的问题中写出来。

<div class="move"></div>​

.move
{
    width: 100px;
    height:100px;
    border:1px solid red;
}​