How to catch keyboard input with jQuery .keyup() function

Question

Working on a simple hangman game, and I'm trying to catch the user input with the keyup(), but when I log it to the console I'm realizing something isn't working right... this is my code:

$(document).keyup(function(e) {

    userInput = e.value;
    console.log(userInput);

});

I also tried doing this, but it isn't working either.

$(document).keyup(function(e) {

    userInput = $(this).val();
    console.log(userInput);

});

oh, by the way, userInput is a global variable.

Possible duplicate of [jQuery Event Keypress: Which key was pressed?](http://stackoverflow.com/questions/302122/jquery-event-keypress-which-key-was-pressed) — Alexander Nied, Mar 15 '17 at 05:02
Possible duplicate: http://stackoverflow.com/questions/302122/jquery-event-keypress-which-key-was-pressed — Alexander Nied, Mar 15 '17 at 05:02
when I use e.value I get undefined back. when I do $(this).val(), I get a blank space back. e.which gives me the ASCII code, but not the actual letter... — jsdev17, Mar 15 '17 at 05:19

Mamun · Accepted Answer · 2018-03-25T08:59:43.650

8

You have to get the value from target property of the event. Try the following way:

$('#txtInput').on('keyup', function(e) {

    var userInput = e.target.value;
    console.log(userInput);

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Input: <input type='text' id="txtInput"/>

edited Mar 25 '18 at 08:59

answered Mar 15 '17 at 05:03

Mamun

66,969
9
47
59

score 4 · Answer 2 · answered Mar 15 '17 at 05:02

4

$( "#whichkey" ).on( "keydown", function( event ) {
  $( "#log" ).html( event.type + ": " +  event.which );
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="whichkey" placeholder="type something">
<div id="log"></div>

Use event.which

Description: For key or mouse events, this property indicates the specific key or button that was pressed.

answered Mar 15 '17 at 05:02

guradio

15,524
4
36
57

hey, thanks... I completely forgot to say that I'm trying to display the letter instead of the ASCII value... – jsdev17 Mar 15 '17 at 05:05
print its `.val()` – guradio Mar 15 '17 at 05:11
like this...? $(this).val()? – jsdev17 Mar 15 '17 at 05:13

How to catch keyboard input with jQuery .keyup() function

2 Answers2

Linked