THE WORLD'S LARGEST WEB DEVELOPER SITE

KeyboardEvent which Property

❮ DOM Events ❮ KeyboardEvent

Example

Get the Unicode value of the pressed keyboard key:

var x = event.which;
Try it Yourself »

More "Try it Yourself" examples below.


Definition and Usage

The which property returns the Unicode character code of the key that triggered the onkeypress event, or the Unicode key code of the key that triggered the onkeydown or onkeyup event.

The difference between the two code types:

  • Character codes - A number which represents an ASCII character
  • Key codes - A number which represents an actual key on the keyboard

These types do not always mean the same thing; for example, a lower case "w" and an upper case "W" have the same keyboard code, because the key that is pressed on the keyboard is the same (just "W" = the number "87"), but a different character code because the resulting character is different (either "w" or "W", which is "119" or "87") - See "More Examples" below to better understand it.

Tip: To find out if the user is pressing a printable key (e.g. "a" or "5"), it is recommended to use this property on the onkeypress event. To find out if the user is pressing a function key (e.g. "F1", "CAPS LOCK" or "Home") use the onkeydown or onkeyup event.

Note: The which property is not supported in IE8 and earlier. For these browser versions, you can use the keyCode property. However, the keyCode property does not work on the onkeypress event in Firefox. For a cross-browser solution, you can use the following code:

var x = event.which || event.keyCode;  // Use either which or keyCode, depending on browser support

Tip: For a list of all Unicode characters, please study our Complete Unicode Reference.

Tip: If you want to convert the returned Unicode value into a character, use the fromCharCode() method.

Note: This property is read-only.

Note: Both the which and keyCode property is provided for compatibility only. The latest version of the DOM Events Specification recommend using the key property instead (if available).

Tip: If you want to find out whether the "ALT", "CTRL", "META" or "SHIFT" key was pressed when a key event occured, use the altKey, ctrlKey, metaKey or shiftKey property.


Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Property
which Yes 9.0 Yes Yes Yes


Syntax

event.which

Technical Details

Return Value: A Number, representing either a Unicode character code or the Unicode key code
DOM Version: DOM Level 2 Events

More Examples

Example

Using onkeypress and onkeydown to demonstrate the differences between character codes and keyboard codes:

<input type="text" onkeypress="uniCharCode(event)" onkeydown="uniKeyCode(event)">

function uniCharCode(event) {
    var char = event.which || event.keyCode; // event.keyCode is used for IE8 and earlier
    document.getElementById("demo").innerHTML = "Unicode CHARACTER code: " + char;
}

function uniKeyCode(event) {
    var key = event.which || event.keyCode; // event.keyCode is used for IE8 and earlier
    document.getElementById("demo2").innerHTML = "Unicode KEY code: " + key;
}

When pressing the "a" key on the keyboard (not using caps lock), the result of char and key will be:

Unicode CHARACTER code: 97
Unicode KEY code: 65
Try it Yourself »

Example

Alert some text if the user presses the Escape key:

<input type="text" onkeydown="myFunction(event)">

function myFunction(event) {
    var x = event.which || event.keyCode; // event.keyCode is used for IE8 and earlier
    if (x == 27) {  // 27 is the ESC key
        alert ("You pressed the Escape key!");
    }
}
Try it Yourself »

Example

Convert the Unicode value into a character (does not work for function keys):

var x = event.which || event.keyCode;   // Get the Unicode value
var y = String.fromCharCode(x);         // Convert the value into a character
Try it Yourself »

Related Pages

HTML DOM reference: KeyboardEvent key Property

HTML DOM reference: KeyboardEvent keyCode Property

HTML DOM reference: KeyboardEvent charCode Property


❮ DOM Events ❮ KeyboardEvent