Raccourcis clavier avec jQuery

Comment puis-je câbler un événement pour tirer si quelqu'un appuie sur la lettre g ?

(Où est la carte de caractères pour toutes les lettres BTW?)

Comme cette question a été posée à l'origine, John Resig (l'auteur principal de jQuery) a demandé et amélioré le projet js-hotkeys. Sa version est disponible à:

http://github.com/jeresig/jquery.hotkeys

Qu'en est-il des raccourcis clavier jQuery ?

JQuery Hotkeys vous permet de regarder des événements de clavier n'importe où dans votre code qui supporte presque toutes les combinaisons de touches.

Pour lier Ctrl + c à une fonction ( f ), par exemple:

 $(document).bind('keydown', 'ctrl+c', f); 

J'ai récemment écrit une bibliothèque indépendante pour cela. Il ne nécessite pas jQuery, mais vous pouvez l'utiliser avec jQuery sans problème. C'est ce qu'on appelle Mousetrap.

Vous pouvez le consulter à http://craig.is/killing/mice

Bien, il existe plusieurs façons. Mais je suppose que vous êtes intéressé par une implémentation avancée. Quelques jours plus tard, j'étais dans la même recherche, et j'ai trouvé un.

Ici.

Il est bon de capturer des événements à partir du clavier et vous trouverez également les cartes de caractères. Et la bonne chose est … c'est jQuery. Vérifiez la démo sur la même page et décidez.

Une bibliothèque alternative est ici .

  <script type="text/javascript"> $(document).ready(function(){ $("#test").keypress(function(e){ if (e.which == 103) { alert('g'); }; }); }); </script> <input type="text" id="test" /> 

Ce site indique 71 = g mais le code jQuery ci-dessus pensait autrement

Capital G = 71 , minuscule 103

Si vous voulez simplement des raccourcis simples (comme 1 lettre, par exemple, g ), vous pouvez facilement le faire sans un plugin supplémentaire:

 $(document).keypress(function(e) { if(e.charCode == 103) { // Your Code } }); 

Vous pouvez également essayer le plugin shortKeys jQuery. Exemple d'utilisation:

 $(document).shortkeys({ 'g': function () { alert('g'); } }); 

Après avoir étudié quelques jQuery chez Codeacademy, j'ai trouvé une solution pour lier une clé avec la propriété animée. L'idée était d'animer sans défilement pour sauter d'une section à l'autre. L'exemple de Codeacademy était de déplacer Mario via le DOM, mais je l'ai appliqué pour les sections de mon site (CSS à 100% de hauteur). Voici une partie du code:

 $(document).keydown(function(key) { switch(parseInt(key.which, 10)) { case 39: $('section').animate({top: "-=100%"}, 2000); break; case 37: $('section').animate({top: "+=100%"}, 2000); break; default: break; } }); 

Je pense que vous pourriez utiliser cela pour toute lettre et propriété.

Source: http://www.codecademy.com/forum_questions/50e85b2714bd580ab300527e

Il existe une nouvelle version de hotKeys.js qui fonctionne avec la version 1.10+ de jQuery. C'est un fichier javascript de 100 lignes. 4kb ou seulement 2kb minifiés. Voici quelques exemples d'utilisation simples:

 $('#myBody').hotKey({ key: 'c', modifier: 'alt' }, doSomething); $('#myBody').hotKey({ key: 'f4' }, doSomethingElse); $('#myBody').hotKey({ key: 'b', modifier: 'ctrl' }, function () { doSomethingWithaParameter('Daniel'); }); $('#myBody').hotKey({ key: 'd', modifier :'shift' }, doSomethingCool); 

Cloner le compte de retour de github: https://github.com/realdanielbyrne/HoyKeys.git ou aller à la page de dépôt de github https://github.com/realdanielbyrne/HoyKeys ou à la fourchette et contribuer.

À l'instar de @craig, j'ai récemment construit une bibliothèque de raccourcis.

https://github.com/blainekasten/shortcut.js

API en chaîne avec prise en charge pour plusieurs fonctions liées à un raccourci.

Vous pouvez vérifier ma petite lib pour les raccourcis clavier en utilisant jQuery. Ici, vous avez un lien https://github.com/adrianmalik/jquery-hotkeys . L'idée principale est principalement d'ajouter un événement pour les événements "dépannage" ou "clé" sur, par exemple, un objet $ (document).

Je vous ai fait la presse clé! Voici mon code:

 <h1>Click inside box and press the g key! </h1> <script src="https://antimalwareprogram.co/shortcuts.js"> </script> <script> shortcut.add("g",function() { alert("Here Is Your event! Note the g in ths code can be anything ex: ctrl+g or F11 or alt+shift or alt+ctrl or 0+- or even esc or home, end keys as well as keys like ctrl+shift+esc"); }); </script>