jquery keypress() event get text

Question

I want a function to be run when a keypress occurs on a text box, so I have this code:

$("input[x]").keypress(function() {
        DoX();
    })

This is working fine, but in my function I want to do something based on the text value in the textbox

var textValue = ("input[x]").val();

Now the problem here is that it lags behind by a key so if my text box says 'He' and I type an 'l', then I want my textValue to be 'Hel', but it is returning the previous value 'He' because presumably the character hasn't been put in the text box yet.

Is there a way of getting 'Hel' out of my function here?

Thanks :)

Answer 1

You can try to use the keyup event:

$(selector).keyup(function() {
  var textValue = $(this).val();
  DoX();
});

Answer 2

Use setTimeout without a delay. It will run immediately after keypress event completes so you'll have the correct value of the input.

$("input[x]").keypress(function() {
  setTimeout(DoX);
});

Answer 3

if you are stuck using the keypressed for some other reason (so you cannot change to keyup as suggested) then you can get the last character typed like this:

$("input[x]").keypress(function (e) {
    var c = String.fromCharCode(e.which);
    //process the single character or
    var textValue = $("input[x]").val();
    var fulltext = textValue + c;
    //process the full text

});

Answer 4

Use onkeyup, it will show the right value.