Why am I getting this error for the keydown()?

Question

$(document).ready(function(){
  $("#promptButton").click(function(){
    $("#openPrompt").hide();
    startGame();
  });
});

function startGame(){
  $(document).ready(function(){
$("#gameboard").append("<div class='snakeHead' id='head'> hi </div>");
  var direction;
  moveTimer = setInterval(function() {snakeMove()},1000);
  function snakeMove(){
    function snakeDirection(){
      $(".snakeHead").keydown(function(key){
        if (key.which === 38){
            direction = "up";
            return {"margin-top": "-=20px"}
        } else if(key.which === 40){
            direction = "down"
            return {"margin-top": "+=20px"}
        } else if(key.which === 37){
            direction = "left"
            return {"margin-left": "-=20px"}
        } else if(key.which === 39){
            direction = "right"
            return {"margin-left": "+=20px"}
        } else {
            direction = "right"
            return {"margin-left": "+=20px}"
        };
      });
    };
    $('.snakeHead').animate({'margin-left':'+=20px'}, 'slow');
  }
  });
};

I keep getting

SyntaxError: expected expression, got ')' on line 32 col 11.

I was under the impression that keydown() only needed to be called with the function that would be call when the event triggered. Do I need another expression to call it with?

Thanks for helping, this is my first real project that I'm trying and I'm self-taught, so try to be as clear as possible for me. Thanks!

Answer 1

You have syntax error:

function startGame(){
  $(document).ready(function(){
$("#gameboard").append("<div class='snakeHead' id='head'> hi </div>");
  var direction;
  moveTimer = setInterval(function() {snakeMove()},1000);
  function snakeMove(){
    function snakeDirection(){
      $(".snakeHead").keydown(function(key){
        if (key.which === 38){
            direction = "up";
            return {"margin-top": "-=20px"}
        } else if(key.which === 40){
            direction = "down"
            return {"margin-top": "+=20px"}
        } else if(key.which === 37){
            direction = "left"
            return {"margin-left": "-=20px"}
        } else if(key.which === 39){
            direction = "right"
            return {"margin-left": "+=20px"}
        } else {
            direction = "right"
            return {"margin-left": "+=20px}" <--- Here --->
        };
      });
    };
    $('.snakeHead').animate({'margin-left':'+=20px'}, 'slow');
  }
  });
};