javascript - スネークスクリプトが変数に値を渡していない

Question

これが私のヘビのスクリプトです-

http://jsfiddle.net/6bKHc/24/

ヘビゲームを作り始めましたが、基本的にmove（top）、move（bottom）ecが動作していません。なぜ何かアイデアはありますか？このように要素を変数に渡すことができないことを理解しているので、それを正しく行う方法を教えてもらえますか？

Answer 1

それを機能させるには、次のようにコードをムード化する必要があります。

$(document).keydown(function() {
    var inter;
    return function(event) {
        var move, prevDirection;
        clearInterval(inter);
        inter = setInterval(move = function(direction) {
            var value, prop;
            switch (direction || prevDirection) {
            case "top":
                prop = "top";
                value = -5;
                break;
            case "bottom":
                prop = "top";
                value = 5;
                break;
            case "left":
                prop = "left";
                value = -5;
                break;
            case "right":
                prop = "left";
                value = 5;
                break;
            }
            if (direction) prevDirection = direction;
            $(".snake").css(prop, $(".snake").position()[prop] + value);

        }, 500);
        if (event.which == 40) {
            move('bottom');
        } else if (event.which == 39) {
            move('right');
        } else if (event.which == 37) {
            move('left');
        } else if (event.which == 38) {
            move('top')
        };
    }
}());​
  ​

http://jsfiddle.net/6bKHc/42/

Answer 2

構文をクリアし、エラーを確認しました。これで開始できます。

$(document).keydown(function(event){
    var move, inter;
    inter = setInterval(move = function() {
        var dir = $(".snake").data('dir');
        var snake = $('.snake');

        if(dir == 'top') {
            snake.stop().animate({"top": "+=5px"});
        }
        if(dir == 'bottom') {
            snake.stop().animate({"top": "-=5px"});
        }
        if(dir == 'left') {
            snake.stop().animate({"left": "+=5px"});
        }
        if(dir == 'right') {
            snake.stop().animate({"top": "-=5px"});
        }
    }, 500);
    if(event.which == 40) {
        $(".snake").data('dir','top');
    } else if(event.which == 39) {
        $(".snake").data('dir','left');           
    } else if(event.which == 37) {
        $(".snake").data('dir','right');        
    } else if(event.which == 38) {
       $(".snake").data('dir','bottom');    
    }; });​

フィドル

行うべき明らかな追加のカップル：

• 境界チェック
• アニメーションの滑らかさ。