locked
Get directional keys (up, down, left, right)

    Question

  • how can I get up down left and right keys onkeypress?

    also how can I get tab and enter?

    Thanks

    Monday, September 26, 2011 3:44 AM

Answers

  • Should be able to set a listener on the document itself:

     

      var handleInput = function(event) {
        switch(event.keyCode) {
          //ENTER
          case 13:
            break;
          //SPACEBAR
          case 32:
            break;
          //LEFT ARROW
          case 37:
            break;
          //UP ARROW
          case 38:
            break;
          //RIGHT ARROW
          case 39:
            break;
          //DOWN ARROW
          case 40:
            break;
        }
      }
    
    document.addEventListener("keyup", handleInput, false);
    

    I had to do this once for a simple canvas game. I ended up using the keyup even since I wanted to make the player mash buttons. I added in enter/spacebar just now so you might want to test those keycodes.

     

    Cheers,

    -Jeff

    Monday, September 26, 2011 6:35 PM
  • The key code of the Tab is "9", you could get it by setting a breakpoint on the line "switch(event.keyCode)" , and press the Tab key while debugging this app.

    Sincerely,


    Bob Bao [MSFT]
    MSDN Community Support | Feedback to us
    Get or Request Code Sample from Microsoft
    Please remember to mark the replies as answers if they help and unmark them if they provide no help.

    Tuesday, September 27, 2011 10:01 AM

All replies

  • Should be able to set a listener on the document itself:

     

      var handleInput = function(event) {
        switch(event.keyCode) {
          //ENTER
          case 13:
            break;
          //SPACEBAR
          case 32:
            break;
          //LEFT ARROW
          case 37:
            break;
          //UP ARROW
          case 38:
            break;
          //RIGHT ARROW
          case 39:
            break;
          //DOWN ARROW
          case 40:
            break;
        }
      }
    
    document.addEventListener("keyup", handleInput, false);
    

    I had to do this once for a simple canvas game. I ended up using the keyup even since I wanted to make the player mash buttons. I added in enter/spacebar just now so you might want to test those keycodes.

     

    Cheers,

    -Jeff

    Monday, September 26, 2011 6:35 PM
  • thanks!

    and does anyone know about tab?

    ill mark as answer as soon as i get a reply.

    thanks

    Tuesday, September 27, 2011 3:58 AM
  • The key code of the Tab is "9", you could get it by setting a breakpoint on the line "switch(event.keyCode)" , and press the Tab key while debugging this app.

    Sincerely,


    Bob Bao [MSFT]
    MSDN Community Support | Feedback to us
    Get or Request Code Sample from Microsoft
    Please remember to mark the replies as answers if they help and unmark them if they provide no help.

    Tuesday, September 27, 2011 10:01 AM