Javascript keyup / onkeyup wrong element

Viewed 753

Is anyone having the same issue? When typing quickly into a textbox and skip to a next textbox (by pushing the 'tab' key) the keyup event is registered from the wrong element.

Behaviour:

  1. Precondition: We have two textboxes; with javascript registrered to the key-up event
  2. Action: Type quicky in textbox and switch to next textbox with 'tab' key.
  3. End situation: All the pressed characters are rendered in the first textbox and the second textbox is selected (but empty); Javascript keyup events registers the last x (depends on type speed) from the last element.(unexpected)

Expected end situation:
- All the pressed characters are rendered in the first textbox and the second textbox is selected (but empty); Javascript: only the last ('tab' keyup event) is registered from the last element.

(this problem is in plain javascript but also propagates to jQuery onkeyup events)

Tested in browsers: - Chrome (Version 49.0.2623.87 m (64-bit)) - FireFox (45.0.1) - Edge

JSFiddle: https://jsfiddle.net/xk09542f/4/

js:

document.getElementById('inp1').onkeyup = function(e) {
     console.log(this.id + ' ' + e.which);
}
document.getElementById('inp2').onkeyup = function(e) {
  console.log(this.id + ' ' + e.which);
}

html:

<input id="inp1" type="text">
<input id="inp2" type="text">

output: see console;

1 Answers
Related