javascript - jQuery的CSS左像素更改

Question

右箭头没有移动汽车，如果它很明显，我很抱歉，但我不知道为什么。

http://jsfiddle.net/W9HDt/

 $(document).ready(function () {

            $(document).keypress(function (e) {
                if (e.which == 39) {
                    $(".car").css("left", "+=25px");
                }
            });

 });

根据Javascript Char Codes (Key Codes) 39是右箭头键的代码

Answer 1

对于箭头键等非显示键，可能不会触发按键事件，请尝试keydown或keyup代替。

Spec : keypress （仅适用于产生字符值的键）

$(document).ready(function () {

    $(document).keyup(function (e) {
        if (e.which == 39) {
            $(".car").css("left", "+=25px");
        }
    });

});

演示：小提琴

Answer 2

检查这个小提琴

e.which3 的值是 51 而不是 39。

 $(document).ready(function () {

            $(document).keypress(function (e) {
                if (e.which == 51) {
                    $(".car").css("left", "+=25px");
                }
            });


 });

检查参考

Answer 3

我知道这个问题已经得到解答并且答案已被接受，但我认为这不是最好的答案。

keypress 事件仅触发可见字符值是不正确的。它确实会随任何按键触发，但问题是您正在检查错误的事件属性，而不是 keyCode。否则试试这个：

$(document).keypress(function (e) {
    if (e.keyCode == 39) {
        $(".car").css("left", "+=25px");
    }
    if (e.keyCode == 37) {
        $(".car").css("left", "-=25px");
    }
});

keyup 和 keydown 事件仅在分别释放或按下键时触发。如果您想按住键并看到汽车移动的方式是使用keyCode。

尽情享受驾驶乐趣吧！

还有小提琴