In order to access this site you need to enable JavaScript!

You are here: Reference > JavaScript > client-side > event handling > properties > which (event)

which property (event)

Browser support:

9

Returns the Unicode character or key code of the key or the identifier of the mouse button that was pressed when the current event fired.

Key events:

In case of onkeypress events, the which property retrieves the Unicode character code of the key that was pressed.
In case of onkeydown and onkeyup events, the which property retrieves the Unicode key code of the key that was pressed.

In Internet Explorer before version 9, use the cross-browser keyCode property for key events instead. The keyCode property is identical to the which property for key events in Firefox, Opera, Google Chrome, Safari and Internet Explorer from version 9, except for onkeypress events in Firefox. For details, see the page for the keyCode property.

Mouse events:

The which property is set for the onmousedown and onmouseup events in all browsers except in Internet Explorer before version 9. In Google Chrome and Safari, the which property can also be used in case of onmousemove, onmouseout and onmouseover events, but the default value of this property is 1, so the left mouse button is not detectable in case of these events. In Internet Explorer before version 9, use the button property instead.

Note: the button property is also supported by Firefox, Opera, Google Chrome and Safari, but its possible values are different from those in Internet Explorer (see the button property for details). If you need to detect the pressed mouse buttons, the simplest solution is to use the which property where it is supported and the button property in other cases. See Example 3 for details.

If you need to detect whether the ALT, CONTROL, META or SHIFT key was down at the time when the event occurred, use the altKey, ctrlKey, metaKey or shiftKey property.

Syntax:

object.which;

You can find the related objects in the Supported by objects section below.

This property is read-only.

Possible values:

Integer that represents the Unicode character or key code or identifies the mouse button that was pressed.

Predefined constants are available for the possible Unicode key codes, in the scope of the KeyboardEvent interface. You can use them directly through the KeyboardEvent interface (KeyboardEvent.DOM_VK_A) or through an instance of the event object. For further details, please see the page for the KeyboardEvent interface. Unfortunately, these constants are only supported by Firefox, so use the numeric values instead of the predefined constants for a cross-browser solution.

For mouse buttons, the value of 1 means the left button, the value of 2 means the middle button and the value of 3 means the right button.

Default: this property has no default value.

Example HTML code 1:

This example illustrates the use of the which property:

<head>
    <script type="text/javascript">
        function GetChar (event){
            var keyCode = ('which' in event) ? event.which : event.keyCode;
            alert ("The Unicode key code is: " + keyCode);
        }
    </script>
</head>
<body>
    <input size="40" value="Write a character into this field!" onkeydown="GetChar (event);"/>
</body>

Copy Code

Preview

Syntax Highlighter

Did you find this example helpful? yes no

Example HTML code 2:

This example shows how to create a text field that does not accept numeric input:

<head>
    <script type="text/javascript">
        function FilterInput (event) {
            var keyCode = ('which' in event) ? event.which : event.keyCode;

            isNumeric = (keyCode >= 48 /* KeyboardEvent.DOM_VK_0 */ && keyCode <= 57 /* KeyboardEvent.DOM_VK_9 */) ||
                        (keyCode >= 96 /* KeyboardEvent.DOM_VK_NUMPAD0 */ && keyCode <= 105 /* KeyboardEvent.DOM_VK_NUMPAD9 */);
            modifiers = (event.altKey || event.ctrlKey || event.shiftKey);
            return !isNumeric || modifiers;
        }
    </script>
</head>
<body>
    The following text field does not accept numeric input:
    <input type="text" onkeydown="return FilterInput (event)" />
</body>

Copy Code

Preview

Syntax Highlighter

Did you find this example helpful? yes no

Example HTML code 3:

This example illustrates the use of the button and which properties:

<head>
    <script type="text/javascript">
        function WhichButton (event) {
                // all browsers except IE before version 9
            if ('which' in event) {
                switch (event.which) {
                case 1:
                    alert ("Left button is pressed");
                    break;
                case 2:
                    alert ("Middle button is pressed");
                    break;
                case 3:
                    alert ("Right button is pressed");
                    break;
                }
            }
            else {
                    // Internet Explorer before version 9
                if ('button' in event) {
                    var buttons = "";
                    if (event.button & 1) {
                        buttons += "left";
                    }
                    if (event.button & 2) {
                        if (buttons == "") {
                            buttons += "right";
                        }
                        else {
                            buttons += " + right";
                        }
                    }
                    if (event.button & 4) {
                        if (buttons == "") {
                            buttons += "middle";
                        }
                        else {
                            buttons += " + middle";
                        }
                    }
                    alert ("The following buttons are pressed: " + buttons);
                }
            }
        }
    </script>
</head>
<body>
    <div onmousedown="WhichButton (event);">Press a mouse button over this text!</div>
</body>