jQuery: comment filtrer les touches sans caractère lors d'un événement de pression de touche?

Question

J'ai essayé de chercher, mais je ne savais pas quels termes rechercher.

J'utilise jQuery et je voudrais utiliser l'événement keypress dans une zone de texte, mais empêcher tous les caractères non imprimables (c.-à-d. Entrée, ÉCHAP, touches fléchées, retour arrière, tabulation, ctrl, insertion, F1-F12, etc.) de se déclencher l'événement.

Existe-t-il un moyen simple de déterminer s'il est imprimable?

Réponse : http://stackoverflow.com/a/20206238/253704

Answer 1

 <script type="text/javascript">
    $("input").keypress(function (e) {
        if (e.which !== 0 && e.charCode !== 0 &&
            !e.ctrlKey && !e.metaKey && !e.altKey) {
            alert(String.fromCharCode(e.keyCode|e.charCode));
        }
    });
</script>
 

Semble fonctionner très bien avec jQuery 1.4.2, FF, IE, Chrome.

Pour plonger dans le désordre qu'est la gestion des événements du clavier JS, voir: JavaScript Madness: événements clavier

---

Mis à jour pour filtrer les combinaisons de touches ctrl, méta et alt selon le commentaire de Daniel .

Answer 2

La réponse sélectionnée pour cette question n'est pas complète. Il ne gère pas le cas où un personnage vous appuyez sur la touche en combinaison avec une touche de modification (par exemple, CTRL-A).

Essayez, par exemple, en tapant CTRL-A l'aide de firefox avec le code suivant. La réponse actuelle le considérer comme un personnage:

HTML:

<input placeholder="Try typing CTRL-A in Firefox" style="width: 200px"/>

Javascript:

$("input").keypress(function (e) {
    if (e.which !== 0 && e.charCode !== 0) {
        alert(String.fromCharCode(e.keyCode|e.charCode));
    }
});

http://jsfiddle.net/4jx7v/

Remarque: une alerte ne sera pas déclenché si l'aide de certains navigateurs (google Chrome), puisqu'ils ne mettent pas le feu à un événement keypress pour les non-caractères.

Une meilleure solution pourrait être:

HTML:

<input placeholder="Try typing CTRL-A in Firefox" style="width: 200px"/>

Javascript:

$("input").keypress(function (e) {
    if (e.which !== 0 && e.charCode !== 0 &&
        !e.ctrlKey && !e.metaKey && !e.altKey) {
        alert(String.fromCharCode(e.keyCode|e.charCode));
    }
});

http://jsfiddle.net/hY5f4/

Dans ce cas, l'alerte est déclenché quand Un est pressé, pas de CTRL-A pour tous les navigateurs.

Answer 3

/* handle special key press */
function checkCptKey(e)
{
    var shouldBubble = true;
    switch (e.keyCode)
    {
        // user pressed the Tab                                                                                                                                                                      
        case 9:
            {
                $(".cptIcdProcedureSelect").toggleClass("cptIcdProcedureSelectVisible");
                 shouldBubble = false;
                break;
            };
            // user pressed the Enter    
        case 13:
            {
                $(".cptIcdProcedureSelect").toggleClass("cptIcdProcedureSelectVisible");
                break;
            };
            // user pressed the ESC
        case 27:
            {
                $(".cptIcdProcedureSelect").toggleClass("cptIcdProcedureSelectVisible");
                 break;
            };
    };
    /* this propogates the jQuery event if true */
    return shouldBubble;
};
   /* user pressed special keys while in Selector */
   $(".cptCode").keydown(function(e)
   {
       return checkCptKey(e, $(this));
   });

Answer 4

Vous pouvez utiliser des expressions régulières comme celle-ci

 $('something').keypress(function(e) {
    if(e.match(YourRegularExpressionHere)) {
        //do something
    } 
});
 

Cela ne fera quelque chose que s'il correspond à l'expression régulière.

Jetez un œil aux expressions régulières. http://www.regular-expressions.info/javascript.html