Propriété keyCode
et liste des valeurs
Cette propriété permet de récupérer la valeur entière de la touche activée. Il s'agit donc d'un chiffre.
Voici la liste des valeurs des touches les plus courantes :
KEY_DOWN = 40;
KEY_UP = 38;
KEY_LEFT = 37;
KEY_RIGHT= 39;
KEY_END = 35;
KEY_BEGIN= 36;
KEY_BACK_TAB=8; KEY_TAB = 9;
KEY_SH_TAB=16;
KEY_ENTER= 13;
KEY_ESC = 27;
KEY_SPACE= 32;
KEY_DEL = 46;
KEY_A = 65;
KEY_B = 66;
KEY_C = 67;
KEY_D = 68;
KEY_E = 69;
KEY_F = 70;
KEY_G = 71;
KEY_H = 72;
KEY_I = 73;
KEY_J = 74;
KEY_K = 75;
KEY_L = 76;
KEY_M = 77;
KEY_N = 78;
KEY_O = 79;
KEY_P = 80;
KEY_Q = 81;
KEY_R = 82;
KEY_S = 83;
KEY_T = 84;
KEY_U = 85;
KEY_V = 86;
KEY_W = 87;
KEY_X = 88;
KEY_Y = 89;
KEY_Z = 90; KEY_PF1 = 112;
KEY_PF2 = 113;
KEY_PF3 = 114;
KEY_PF4 = 115;
KEY_PF5 = 116;
KEY_PF6 = 117;
KEY_PF7 = 118;
KEY_PF8 = 119;
|
Voici, fonction par fonction, le code du fichier 'keyboard.js'.
Le contenu intégral est donné plus bas dans la section Annexes.
Fonction applyKey
function applyKey (_event_){
// --- Retrieve event object from current web explorer
var winObj = checkEventObj(_event_);
var intKeyCode = winObj.keyCode;
var intAltKey = winObj.altKey;
var intCtrlKey = winObj.ctrlKey;
// 1° --- Access with [ALT/CTRL+Key]
if (intAltKey ¦¦ intCtrlKey) {
if ( intKeyCode == KEY_RIGHT ¦¦ intKeyCode == KEY_LEFT ){
// --- Display Message
alert("Hello with ALT/CTRL !");
// 3° --- Map the keyCode in another keyCode not used
winObj.keyCode = intKeyCode = REMAP_KEY_T;
winObj.returnValue = false;
return false;
}
}
// 2 ° --- Access without [ALT/CTRL+Key]
else {
if ( intKeyCode == KEY_RIGHT ¦¦ intKeyCode == KEY_LEFT ){
// --- Display Message
alert("Hello !");
// 3° --- Map the keyCode in another keyCode not used
winObj.keyCode = intKeyCode = REMAP_KEY_T;
winObj.returnValue = false;
return false;
}
}
}
Décortiquons la pas à pas.
Dans un premier temps, il s'agit de récupérer l'objet 'event' selon le type de navigateur.
Pour cela, nous invoquons la fonction 'checkEventObj'.
Puis nous récupérons les valeurs des propriétés 'keyCode', 'altKey' et 'ctrlKey' de cet objet 'event' et les stockons dans des variables locales.
Plusieurs contrôles sont effectués pour séparer les cas où :
La touche 'ALT' ou 'CTRL' est activée (CAS 1°)
La touche 'ALT' ou 'CTRL' n'est pas activée (Cas 2°)
Nous appliquons un traitement dans le cas où seules les touches 'KEY_RIGHT' et 'KEY_LEFT' sont activée (respectivement flèche droite et flèche gauche du clavier). Ces deux valeurs correspondent à celles définies dans la liste des valeurs numériques des touches d'un clavier standard.
Pour finir (En 3°), nous effectuons un mapping de ces touches. (très important)
Lorsque vous interceptez de cette façon un évènement clavier, il faut ensuite l'inhiber
Les navigateurs définissent des comportements par défaut sur certaines touches. Si vous ne faites pas de redirection, ces actions seront déclenchées à la suite des votre, ce qui peut avoir des effets indésirables selon les touches et les navigateurs.
Fonction checkEventObj : cette fonction retourne l'objet 'event' approprié selon le type de navigateur.
function checkEventObj ( _event_ ){
if ( window.event ) // --- IE explorer
return window.event;
else // --- Netscape and other explorers
return _event_;
}
|
