jQuery event.keyCode | event.charCode | event.which - Code Generator

11:49 PM Unknown 0 Comments

Key event handling is not that easy after all. However, it's more advisable to reliably get character codes during the keyPress event.

There are two different types of codes:
1.) event.keyCode: Keyboard Codes that Returns the Unicode value of a non-character key in a keypress event or any key in any other type of keyboard event.
2.) event.charCode: Character Codes that Returns the Unicode value of a character key pressed during a keypress event.

In this tool I was using jQuery events to get the corresponding event codes of the keys the user pressed.

CODE:

 
$(document).ready(function(){
   $('#key').live('keypress', processKeyPress);
   $('#key').live('keydown', processKeyDown);
   $('#key').live('keyup', processKeyUp);

   function processKeyDown(e) {
            processEvent('keyPress', e); 
   }

   function processKeyPress(e) {
            processEvent('keyDown', e); 
   }
   
   function processKeyUp(e) {
            processEvent('keyUp', e); 
   }

   processEvent = function(eventType, e) {
           //Use window.event if it's IE
            window.event ? e = window.event : e = e;

            $('#'+ eventType +'_keyCode').text(e.keyCode);
            $('#'+ eventType +'_charCode').text(e.charCode);
            $('#'+ eventType +'_which').text(e.which);
            $('#key').focus().select();
   };
});