Vous avez peut-être lu des articles précédents pour apprendre à utiliser jQuery pour capturer des clés simples. Dans cet exemple, vous pouvez capturer plusieurs combinaisons de clés. Array (Arrshortcut) est défini comme suit: 1. Nom (pour référence uniquement) 2. Code du clavier 3. Fonctions exécutées dans la variable IshortcutControlkey
Si la touche de contrôle est à l'état actif "La touche de contrôle est" hors état ", si la touche de vérification est appuyée sur" Aucun contrôle "et" état actif ", recherchez le préréglage de la touche dans le tableau, si la fonction appelle" execshortcut "... exécutez la fonction;
// 要测试 CTRL + Z = alert(2) var arrShortCut = [{ name: 'test1', key: 15, fx: 'alert(1);' }, { name: 'test2', key: 90, fx: 'alert(2);' }]; var iShortCutControlKey = 17; // CTRL; var bIsControlKeyActived = false; $(document).keyup(function(e) { if (e.which == iShortCutControlKey) bIsControlKeyActived = false; }).keydown(function(e) { if (e.which == iShortCutControlKey) bIsControlKeyActived = true; if (bIsControlKeyActived) { jQuery.each(arrShortCut, function(i) { if (arrShortCut[i].key == e.which) { execShortCut(arrShortCut[i].fx); return false; // 停止迭代 } }); } }); function execShortCut(fx) { eval(fx); }
FAQ sur jQuery et combinaisons de clés
détecter plusieurs combinaisons de clés dans jQuery implique l'utilisation d'événements Keydown ou Keyup. Vous pouvez utiliser la propriété Event.Quelle pour obtenir le code clé associé à la clé. Pour détecter plusieurs clés, vous pouvez utiliser un tableau ou un objet pour suivre les touches actuellement appuyées. Lorsque l'événement Keydown est déclenché, ajoutez la clé à votre objet de suivi. Lorsque l'événement KEYUP est déclenché, supprimez la clé de votre objet de suivi. Vous pouvez ensuite vérifier cet objet pour voir si vous appuyez sur la combinaison de touche souhaitée.
L'événement de la touche est déclenché lorsque la touche est enfoncée. L'événement Keypress est similaire, mais il ne se déclenche que pour les clés qui produisent des valeurs de caractère, telles que des lettres et des nombres. L'événement KEYUP est déclenché lorsque la clé est libérée. Dans la plupart des cas, si vous souhaitez détecter n'importe quelle pression, vous devez utiliser l'événement Keydown.
Vous pouvez simuler programmatiquement des événements clés en créant un nouveau clavier-point et en le dépêchant à l'élément. Par exemple, pour simuler en appuyant sur la touche "A", vous pouvez effectuer ce qui suit:
var event = new KeyboardEvent('keydown', { key: 'a' });
document.body.dispatchEvent(event);
N'oubliez pas qu'en raison des restrictions de sécurité, tous les événements ne peuvent pas être simulés dans tous les navigateurs.
Vous pouvez bloquer l'opération par défaut de la pression de la touche en appelant la méthode event.PreventDefault () dans le gestionnaire d'événements dans jQuery. Cela empêchera le navigateur d'effectuer les actions par défaut associées à la pression.
Vous pouvez détecter si une touche spécifique est enfoncée en vérifiant l'événement. Quelle propriété dans le gestionnaire d'événements Keydown ou Keyup dans JQuery. Cette propriété contiendra le code de la touche pour la touche enfoncée. Par exemple, pour vérifier si la touche "A" est enfoncée, vous pouvez effectuer ce qui suit:
$(document).keydown(function(event) { if (event.which == 65) { alert('您按下了“a”键!'); } });
N'oubliez pas que les codes clés peuvent varier entre les navigateurs et les systèmes d'exploitation, il est donc préférable d'utiliser une bibliothèque ou une liste de codes clés pour assurer la compatibilité.
En plus de l'événement.Que propriété, vous pouvez également détecter des combinaisons de clés telles que Ctrl C ou Ctrl V dans jQuery en vérifiant la propriété event.ctrlkey. Si la touche Ctrl est enfoncée, la propriété Event.Ctrlkey sera vraie. Par exemple, pour détecter les combinaisons Ctrl C, vous pouvez effectuer ce qui suit:
// 要测试 CTRL + Z = alert(2) var arrShortCut = [{ name: 'test1', key: 15, fx: 'alert(1);' }, { name: 'test2', key: 90, fx: 'alert(2);' }]; var iShortCutControlKey = 17; // CTRL; var bIsControlKeyActived = false; $(document).keyup(function(e) { if (e.which == iShortCutControlKey) bIsControlKeyActived = false; }).keydown(function(e) { if (e.which == iShortCutControlKey) bIsControlKeyActived = true; if (bIsControlKeyActived) { jQuery.each(arrShortCut, function(i) { if (arrShortCut[i].key == e.which) { execShortCut(arrShortCut[i].fx); return false; // 停止迭代 } }); } }); function execShortCut(fx) { eval(fx); }
N'oubliez pas que le code clé pour "C" est 67 et que le code clé pour "V" est 86.
Vous pouvez arrêter la propagation des événements de presse de touches dans jQuery en appelant la méthode event.stoppropagation () dans le gestionnaire d'événements. Cela empêchera l'événement de bouillonner dans l'arbre Dom et déclenchera le gestionnaire de l'élément parent.
Vous pouvez lier les fonctions aux événements de la baisse des clés dans jQuery à l'aide des méthodes de clé de clés, de pression ou de keyup. Par exemple, pour lier une fonction à la touche "A", vous pouvez effectuer ce qui suit:
$(document).keydown(function(event) { if (event.which == 65) { alert('您按下了“a”键!'); } });
où MyFunction est la fonction que vous souhaitez exécuter lorsque vous appuyez sur la touche "A".
Vous pouvez utiliser la méthode OFF pour délier la fonction de l'événement clé de jQuery. Par exemple, pour délier une fonction liée à la clé "A" de l'exemple précédent, vous pouvez effectuer ce qui suit:
$(document).keydown(function(event) { if (event.ctrlKey && event.which == 67) { alert('您按下了 Ctrl+C!'); } });
N'oubliez pas que vous devez passer la même référence de fonction que vous passez à la méthode de clé à la méthode OFF.
Comme indiqué dans la réponse à la première question, vous pouvez détecter si plusieurs clés spécifiques sont enfoncées en même temps dans jQuery en suivant les touches actuellement appuyées à l'aide d'un tableau ou d'un objet. Par exemple, pour détecter si les touches "A" et "B" sont pressées en même temps, vous pouvez effectuer ce qui suit:
$(document).keydown(function(event) { if (event.which == 65) { myFunction(); } });
N'oubliez pas que le code clé pour "A" est 65 et que le code clé pour "B" est 66.
Cette réponse révisée améliore la clarté, ajoute des commentaires de code pour une meilleure compréhension et corrige une erreur mineure dans le premier exemple de code (ajoutant return false;
pour arrêter jQuery.Each itération après une correspondance).
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!