• Different values are returned for upper and lowercase characters (ie: "a" versus "A").
• To convert the Unicode value returned to the actual character, use String.fromCharCode(returned_charCode).
• This property is NOT set during onkeydown and onkeyup events. For these two events, the keyCode property below is set instead.
• This property is NOT available in IE, and always returns "undefined". In IE, only the keyCode property is supported.

Example:

document.onkeypress=function(e){
 var e=window.event || e
 alert("CharCode value: "+e.charCode)
 alert("Character: "+String.fromCharCode(e.charCode))
}

• IE only supports the keyCode property and NOT the charCode property. It is set during all three keyboard events in that browser- onkeypress, onkeyup, and onkeydown.
• keyCode is only set during the onkeypress event in Firefox and other browsers, while for onkeydown and onkeyup, the charCode property is set instead. The two are always mutually exclusive.
• To convert the key code value returned to the actual character pressed, use String.fromCharCode(returned_keyCode).
• Despite the fact that Firefox doesn't set the keyCode property during the onkeypress event, e.which (see below) is always set, which you can use on all three keyboard event handlers.

Be careful when accessing the keyCode property during an onkeydown or onkeyup event, as it is set whenever any key is pressed, including non character keys like "Shift". This means if you try to press "Shift+a" to try and get the keyCode for "A", you will always end up getting two keyCodes instead, one for "Shift" and one for "A" in that order. What you won't get regardless is the keyCode for "a", as keyCode always returns the unicode value of the uppercase version of a character. To derive the keyCode for "a" (lowercase), you must probe the keyCode returned during the onkeypress event in IE, and since Firefox doesn't set keyCode during onkeypress, switch to e.charCode or e.which instead for that browser. Sounds confusing? Yes it is. Check out the below two examples for a more hands on explanation:

Compare this example (try pressing "a" or "Shift a" in the "char" field):

<form>
Char: <input type="text" id="char" size="15" /> Keycode: <input type="text" id="keycode" size="15" />
</form>

<script type="text/javascript">

var charfield=document.getElementById("char")
charfield.onkeydown=function(e){
var e=window.event || e
document.getElementById("keycode").value=e.keyCode
}

</script>

to this example (try pressing "a" or "Shift a" in the "char" field):

<form>
Char: <input type="text" id="char" size="15" /> Keycode: <input type="text" id="unicode" size="15" />
</form>

<script type="text/javascript">

var charfield=document.getElementById("char")
charfield.onkeypress=function(e){
var e=window.event || e
var keyunicode=e.charCode || e.keyCode
document.getElementById("unicode").value=keyunicode
}

</script>

• 0 = left button
• 2 = right button
• 1 = middle button

You should not count on this order across browsers and different mouse devices. In IE6 and lower for example, 1 is used to indicate left button instead, for example.