X Key Events Demo

Intro

Experiment with this page to learn about Key events in different browsers.

Demo

The following shows xEvent object properties during keypress, keydown, and keyup events.

target

mouse x

mouse y

The following shows keyCode values for each event.

keypress

keydown

keyup

The following allows you to control bubbling and default action.

Stop Propagation

Prevent Default

Observations

I ran a few tests, all on WinXP...

* Opera 8.0 *

onkeydown and onkeyup:
  - alpha, shift and special (f-keys and arrows) keys give the same values in both
    'keyCode' and 'which', and alpha values are forced to uppercase.

onkeypress:
  - alpha keys give values in both 'keyCode' and 'which' (case not forced).
  - shift keys give a value in both 'keyCode' and 'which' and
    they also change the case of alphas.
  - special keys give values in 'keyCode' and 'which' is zero.


* Firefox 1.0.2 *

onkeydown and onkeyup:
  - alpha, shift and special keys give the same values in both
    'keyCode' and 'which', and alpha values are forced to uppercase.

onkeypress:
  - alpha keys give values in 'which' (case not forced)
    and 'keyCode' is zero.
  - shift keys do not give a value in 'keyCode' nor 'which' but
    they do change the case of alphas.
  - special keys give values in 'keyCode' and 'which' is zero.


* IE 6.0 *

onkeydown and onkeyup:
  - alpha, shift and special keys give values in 'keyCode',
    'which' is undefined, and alpha values are forced to uppercase.

onkeypress:
  - alpha keys give values in 'keyCode' (case not forced).
  - shift keys do not give a value in 'keyCode' but
    they do change the case of alphas.
  - special keys do not give a value in 'keyCode'.


'which' is also used for mouse events (classic NN values: 1/2/3 - left/middle/right).
Firefox also supports 'button' ('standard' values: 0/1/2).

Opera 8 does the same as Firefox with mousedown but doesn't allow the right-click value.
In early versions of O7 they used non-standard and non-IE values (1/3/2).

IE uses 'button' (but not with onclick) with classic IE values: 1/4/2.

Related Demos

License

By your use of X and/or CBE and/or any Javascript from this site you consent to the GNU LGPL - please read it. If you have any questions about the license, read the FAQ and/or come to the forums.