views:

87

answers:

3

What is the functionality of javascript event e.which? Please brief with example.

+3  A: 

read it here...

Reigel
+4  A: 

e.which is not an event, which is a property of the event object, which most people label as e in their event handlers. It contains the key code of the key which was pressed to trigger the event (eg: keydown, keyup).

document.onkeypress = function(myEvent) { // doesn't have to be "e"
    console.log(myEvent.which);
};

With that code, the console will print out the code of any key you press on the keyboard.

nickf
You should note that `console.log` requires Firebug -- which won't be obvious to beginners/every reader.
Brock Adams
It does not really require Firebug, only some sort of console.log (which many more than Firebug provides, for example the webkitt-ens).
npup
`which` also exists on mouse events, and your example won't work on IE, in which an event handler does not receive an event parameter.
Tim Down
+1  A: 

which is a property of Event objects. It is defined for key-related and mouse-related events in most browsers, but in both cases is not defined in IE.

For mouse-related events, which specifies the mouse button that was involved. For IE, the equivalent value is found in window.event.button. Just to complicate things, non-IE browsers also support a button property of mouse events that sometimes reports a different value from which. Also, browsers have different values for different buttons. If you stick to using which in all browsers that support it and button in IE, the one constant is that a value of 1 always means the left mouse button was involved (though not necessarily alone).

document.onmousedown = function(e) {
    e = e || window.event;
    var button = (type e.which != "undefined") ? e.which || e.button;
    if (button == 1) {
        alert("Left mouse button down");
    }
};

For a full analysis, I heartily recommend Jan Wolter's article on JavaScript mouse events.

For key-related events, which relates to the key that has been pressed. For keydown and keyup events, this is relatively simple: it's the key code for the key pressed, and returns the same value as the event's keyCode property. Since all browsers support the keyCode property and IE does not support which, you should always use keyCode for keydown and keyup events.

For keypress events, the situation is more complicated. For printable character keys, which is the character code for the key pressed and is supported in more browsers than the charCode property. In IE the equivalent is again the keyCode property. So for detecting the character typed, the following is the best cross-browser approach. Be aware that the code below should not be used for non-printable keys such as arrow keys, which you should instead detect in the keydown event:

document.onkeypress = function(e) {
    e = e || window.event;
    var charCode = e.which || e.keyCode;
    if (charCode) {
        alert("Character typed: " + String.fromCharCode(charCode));
    }
};

Again, for more details I recommend Jan Wolter's article on JavaScript key events

Tim Down