Question

I’m trying to pass an keydown event from one textbox to another. What I mean with this is that if you, for example, press the ‘a’ key, some code should simulate that key as being pressed in the second textbox.

I do not want to just copy the value of the first textbox into the second – it should be on a per-key basis so to say. Suppose the first textbox contains abc and the second textbox is empty, when you then press the ‘d’ key in textbox 1, textbox 2 should only contain d.

What I already tried is (http://jsfiddle.net/E5qyr/1/):

$('#t1').keydown(function(e) {
    $('#t2').keydown(e);
});

But this does not work (I guess I’m thinking too simple). I know I could append the character pressed by looking at e.keyCode, but also ‘backspace’ etc. has to be working.

Does anybody have an idea to pass a keydown event from one textbox to another?

Answer 1

Textarea elements don’t have listeners automatically installed to them, so triggering a ‘keydown’ event for the #t2 will not show a response. What you want is to just add the text you get from the #t1 keydown event (of which you are listening) and append it to your #t2.

UPDATED with support for backspace. Other codes found here.

Example:

$('#t1').keydown(function(e) {
    if (e.which == 8) { //Backspace
      this.text(this.val().substr(0, this.val().length - 1));
    } else {
      $('#t2').append($('#t1').val());
      this.empty();
    }
});