Keyboard Events cross browser - keypress
HTML
<p>press to get keycodes</p>
<input type="text" id="txtinput">
<pre id="output"></pre>
JavaScript
(function () {
//keydown event
//keyup event
//keypress event (does not fire on modifier keys space, shift, etc designed for user input primarily)
//crossBrowser Events util object
var util = {
addEvent: function (el, type, fn) {
if (typeof addEventListener !== "undefined") {
el.addEventListener(type, fn, false);
} else if (typeof attahcEvent !== "undefined") {
el.attachEvent("on" + type, fn);
} else {
el["on" + type] = fn;
}
},
remove: function (el, type, fn) {
if (typeof removeEventListener !== "undefined") {
el.removeEventListener(type, fn, false);
} else if (typeof detachEvent !== "undefined") {
el.detachEvent("on" + type, fn);
} else {
el["on" + type] = fn;
}
},
getTarget: function (e) {
if (typeof e.target !== "undefined") {
return e.target;
} else {
return e.srcElement;
}
},
preventDefault: function (e) {
if (typeof e.preventDefault !== "undefined") {
e.preventDefault();
} else {
e.returnValue = false;
}
},
getCharCode: function (e) {
if (typeof e.charCode === "number") {
//standard browser we get .charCode
return e.charCode;
} else {
//for legacy IE it is .keyCode
return e.keyCode;
}
}
}
/* --------------------------------------------*/
var txtIn = document.getElementById("txtinput");
var out = document.getElementById("output");
util.addEvent(txtIn, "keyup", function(e) {
out.innerHTML = '';
out.innerHTML += 'e.charCode: ' + e.charCode + ', typeof: ' + (typeof e.charCode) + '\n';
...