J'essaie de déclencher un événement sur les touches fléchées droite et gauche avec jQuery. En utilisant le code suivant, je peux déclencher des événements sur n'importe quelle touche alphanumérique, mais les touches de curseur (haut, bas, gauche, droite) ne déclenchent rien. Je développe le site principalement pour les utilisateurs de IE car il s'agit d'une application métier. Est-ce que je fais quelque chose de mal ici?
$('document').keypress(function(e){
switch (e.which) {
case 40:
alert('down');
break;
case 38:
alert('up');
break;
case 37:
alert('left');
break;
case 39:
alert('right');
break;
default:
alert('???');
}
});
e.which ne fonctionne pas dans IE try e.keyCode , vous voudrez probablement aussi utiliser keydown () au lieu de keypress () si vous ciblez IE.
Voir http://unixpapa.com/js/key.html pour plus d'informations.
Avec jQuery, je l'ai fait de cette façon :
function checkKey(e){
switch (e.keyCode) {
case 40:
alert('down');
break;
case 38:
alert('up');
break;
case 37:
alert('left');
break;
case 39:
alert('right');
break;
default:
alert('???');
}
}
if ($.browser.mozilla) {
$(document).keypress (checkKey);
} else {
$(document).keydown (checkKey);
}
Essayez également ces plugins, qui semblent faire tout ce qui fonctionne pour vous:
http://www.openjs.com/scripts/events/keyboard_shortcuts
http://www.webappers.com/2008/07/31/bind-a-hot-key-combination-with-jquery-hotkeys/
Vous avez le document Word dans une chaîne. Changement:
$('document').keypress(function(e){
à
$(document).keypress(function(e){
Bien sûr, c'est une question fermée, je voudrais ajouter quelque chose à votre discussion
À mozilla, j'ai observé un comportement étrange pour ce code
$(document).keydown(function(){
//my code
});
le code est déclenché deux fois. Lors du débogage, j'ai découvert qu'en réalité, deux événements étaient déclenchés: "pression de touche" et "pression sur la touche". J'ai désactivé l'un des événements et le code m'a montré le comportement attendu.
$(document).unbind('keypress');
$(document).keydown(function(){
//my code
});
Cela fonctionne pour tous les navigateurs et il n'est pas non plus nécessaire de vérifier si le navigateur est spécifique (if ($. Browser.mozilla) {}).
J'espère que cela pourrait être utile pour quelqu'un
Votre code d'origine a $ ('document') ... alors qu'il devrait avoir $ (document) sans les guillemets.