jQuery keypress() event listener

Question

I am trying to execute a function every time a field changes. Just to get started, I am using a simple textarea and a div:

<div id="text"></div>
<textarea id="stuff"></textarea>

<script type="text/javascript">
    $("#stuff").keypress(function () {
        $("#text").text($("#stuff").val());
    });
</script>

This works, but it is always one character behind. If I type "Hello" on the textarea, the div will just say "Hell".

What am I doing wrong?

MoDFoX · Accepted Answer · 2010-08-20 20:26:47Z

4

Try .keyUp() that may fix it.

answered Aug 20, 2010 at 20:26

MoDFoX

2,1342 gold badges21 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Ryan Tenney · Accepted Answer · 2010-08-20 20:27:50Z

1

The keypress event fires before the textarea updates it's value based on the keypress that occurred, otherwise the handler wouldn't be able to cancel the event.

See here: http://jsfiddle.net/zDMbJ/ which arbitrarily cancels an event if the key pressed was 'A'.

answered Aug 20, 2010 at 20:27

Ryan Tenney

1,8413 gold badges16 silver badges29 bronze badges

Comments

chum of chance · Accepted Answer · 2010-08-20 20:32:59Z

0

Try this:

<script type="text/javascript">
    $("#stuff").keyup(function () {
        $("#text").html($(this).val());
    });
</script>

http://jsbin.com/ibido3/edit

answered Aug 20, 2010 at 20:32

chum of chance

6,31010 gold badges50 silver badges77 bronze badges

Collectives™ on Stack Overflow

jQuery keypress() event listener

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related