2010-09-10 14 views
2

Comment puis-je obtenir la touche qui a été enfoncée et, au lieu de renvoyer le code clé, mettre cette clé dans un tableau?Comment obtenir la touche enfoncée et mise en tableau dans JavaScript?

Par exemple, l'utilisateur appuiera sur 'a'. Ensuite, le code mettra un 'a' - pas le code clé du caractère - dans un tableau.

Merci d'avance!

+0

Pourquoi utilisez-vous la propriété de clé? Pour essayer ceci: document.onkeydown = fonction (e) {alert (e.key);}; Il n'est pas nécessaire de convertir keyCode en caractères. – MURATSPLAT

Répondre

7

Qu'en est-il de quelque chose comme ça?

var your_array = []; 

document.onkeydown = function (e) { 
    var keyPress; 

    if (typeof event !== 'undefined') { 
    keyPress = event.keyCode; 
    } 
    else if (e) { 
    keyPress = e.which; 
    } 

    your_array.push(String.fromCharCode(keyPress)); 

    return false; // Prevents the default action 
}; 

MISE À JOUR: Si vous avez besoin d'informations de caractère précis (par exemple, la distinction des majuscules des minuscules, et d'autres choses), assurez-vous de vérifier @Tim Down's commentaires ci-dessous et his other answer.

+0

Vous devez utiliser l'événement 'keypress' pour obtenir le caractère tapé, pas l'événement' keydown'. –

+0

@Tim: Selon [l'article de quriksmode] (http://www.quirksmode.org/js/keys.html), l'événement 'keydown' semble le plus fiable. La principale différence est que lorsque vous utilisez l'événement 'keydown' vous recevez le même' keyCode' pour les minuscules et les majuscules (parce que vous appuyez sur la même touche). Si cela est acceptable ou non, cela dépend de ce que le PO est en train de construire. Est-ce que je manque quelque chose d'autre? –

+0

Avec tout le respect dû à PPK, cette table particulière de quirksmode n'est pas aussi utile que http://unixpapa.com/js/key.html. Le paragraphe intitulé "keyCode et charCode" dans quirksmode en contient cependant le cœur: les événements "keydown" et "keyup" ne contiennent tout simplement pas d'informations sur les caractères. Tout succès que vous pourriez avoir avec elle est une coïncidence et peu fiable. Si vous vous inquiétez du manque de support d'Opera pour 'charCode', Opera supporte heureusement la propriété' which' qui, étant donné qu'elle fonctionne dans tous les navigateurs non IE, est plus utile que 'charCode' et n'est pas couverte par quirksmode. –

2

La réponse de Daniel est parfait, mais si vous voulez obtenir le caractère réel (et non le code numérique), vous pouvez utiliser cette fonction:

String.fromCharCode(code); 

Voir MDN pour plus d'informations.

0

Dans votre gestionnaire d'événements (en supposant e est l'objet événement):

myarray.push(String.fromCharCode(e.charCode)); 

Remarquez comment fromCharCode renvoie le caractère donné un code de caractères Unicode. Notez également comment j'ai utilisé charCode au lieu de keyCode car il est plus correct de retourner le code de caractère, qui est parfois différent du code clé (vous voulez le caractère).

+0

J'allais aussi suggérer 'charCode', mais il y a des navigateurs qui ne le supportent pas: http://www.quirksmode.org/js/keys.html –

+0

C'est une situation difficile. D'une part, pour les navigateurs compatibles, keycode est toujours le code clé, et charcode est toujours la valeur Unicode. Sur les navigateurs non conformes, le charcode n'existe pas et le code clé varie entre le code clé ou la valeur Unicode en fonction du type d'événement. Bien sûr, nous voulons la valeur Unicode, mais cela ne peut jamais être vu dans keycode sur les navigateurs compatibles. Selon le contexte du site Web en cours d'écriture et la population des visiteurs, je suppose qu'il est temps d'aller de l'avant et d'ignorer ces navigateurs flagrants non conformes. –

+0

Gestionnaire d'événements pour quel événement? 'charCode' n'existe que dans les événements' keypress'. Pour IE, 'keyCode' dans un événement' keypress' est le code de caractère et vous n'obtenez pas d'événements keypress dans IE pour les clés non imprimables, donc vous pouvez obtenir des codes de caractères de façon assez fiable. Vois ma réponse. –

3

Vous avez besoin de l'événement keypress pour cela. keydown et keyup ne peuvent pas être utilisés de manière fiable pour obtenir des informations sur les caractères. Une explication excellente et détaillée des événements clés JavaScript est à http://unixpapa.com/js/key.html

var charsTyped = []; 

document.onkeypress = function(evt) { 
    evt = evt || window.event; 

    // Ensure we only handle printable keys 
    var charCode = typeof evt.which == "number" ? evt.which : evt.keyCode; 

    if (charCode) { 
     charsTyped.push(String.fromCharCode(charCode)); 
    } 
}; 
0

j'ai écrit une bibliothèque appelée keysight pour traduire les événements du clavier en touches et des caractères.

var yourKeyArray = [] 
node.addEventListener("keydown", function(event) { 
    var key = keysight(event).key  // ignores shift keys, so 'A' is given as 'a' 
    // var char = keysight(event).char // only characters, and differentiates between 'A' and 'a' 

    yourKeyArray.push(key) 
})