J'utilise un keypressauditeur par exemple ..

addEventListener("keypress", function(event){

}

Cependant, cela ne semble pas détecter un retour arrière qui efface le texte ...

Puis-je utiliser un autre auditeur pour détecter cela?

KeyPress est appelé événement uniquement pour les clés caractères (imprimables), événement KeyDown est élevé pour tous , y compris par exemple non imprimable Control, Shift, Alt, BackSpace, etc.

METTRE À JOUR:

L'événement keypress est déclenché lorsqu'une touche est enfoncée et que cette touche produit normalement une valeur de caractère

Référence .

Essayez keydownau lieu de keypress.

Les événements de clavier se produisent dans cet ordre: keydown, keyup,keypress

Le problème avec le retour arrière est probablement que le navigateur reviendra keyupet que votre page ne verra donc pas l' keypressévénement.

L' keypressévénement peut être différent d'un navigateur à l'autre.

J'ai créé un Jsfiddle pour comparer les événements du clavier (en utilisant les raccourcis JQuery) sur Chrome et Firefox. Selon le navigateur que vous utilisez, un keypressévénement sera déclenché ou non - le retour arrière se déclenchera keydown/keypress/keyupsur Firefox mais uniquement keydown/keyupsur Chrome.

Événements de clic unique déclenchés

sur Chrome

• keydown/keypress/keyuplorsque le navigateur enregistre une entrée clavier ( keypressest déclenché)

• keydown/keyup si aucune saisie au clavier (testé avec alt, shift, backspace, touches fléchées)

• keydown seulement pour l'onglet?

sur Firefox

• keydown/keypress/keyuplorsque le navigateur enregistre une entrée au clavier mais aussi pour le retour arrière, les touches fléchées, l'onglet (donc ici keypressest déclenché même sans entrée)

• keydown/keyup pour alt, shift

Cela ne devrait pas être surprenant car selon https://api.jquery.com/keypress/ :

Remarque: comme l'événement keypress n'est couvert par aucune spécification officielle, le comportement réel rencontré lors de son utilisation peut différer selon les navigateurs, les versions de navigateur et les plates-formes.

L'utilisation du type d'événement keypress est déconseillée par le W3C ( http://www.w3.org/TR/DOM-Level-3-Events/#event-type-keypress )

Le type d'événement keypress est défini dans cette spécification à des fins de référence et d'exhaustivité, mais cette spécification déconseille l'utilisation de ce type d'événement. Lorsqu'ils sont dans des contextes d'édition, les auteurs peuvent s'abonner à l'événement beforeinput à la place.

Enfin, pour répondre à votre question, vous devez utiliser keyupou keydownpour détecter un retour arrière sur Firefox et Chrome.

Essayez-le ici:

$(".inputTxt").bind("keypress keyup keydown", function (event) {
    var evtType = event.type;
    var eWhich = event.which;
    var echarCode = event.charCode;
    var ekeyCode = event.keyCode;

    switch (evtType) {
        case 'keypress':
            $("#log").html($("#log").html() + "<b>" + evtType + "</b>" + " keycode: " + ekeyCode + " charcode: " + echarCode + " which: " + eWhich + "<br>");
            break;
        case 'keyup':
            $("#log").html($("#log").html() + "<b>" + evtType + "</b>" + " keycode: " + ekeyCode + " charcode: " + echarCode + " which: " + eWhich + "<p>");
            break;
        case 'keydown':
            $("#log").html($("#log").html() + "<b>" + evtType + "</b>" + " keycode: " + ekeyCode + " charcode: " + echarCode + " which: " + eWhich + "<br>");
            break;
        default:
            break;
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<input class="inputTxt" type="text" />
<div id="log"></div>

Quelque chose que j'ai écrit au cas où quelqu'un rencontre un problème avec des personnes qui frappent en arrière tout en pensant qu'elles sont dans un champ de formulaire

window.addEventListener("keydown", function(e){
    /*
     * keyCode: 8
     * keyIdentifier: "U+0008"
    */
    if(e.keyCode === 8 && document.activeElement !== 'text') {
        e.preventDefault();
        alert('Prevent page from going back');
    }
});

Ma commande numérique:

function CheckNumeric(event) {
    var _key = (window.Event) ? event.which : event.keyCode;
    if (_key > 95 && _key < 106) {
        return true;
    }
    else if (_key > 47 && _key < 58) {
        return true;
    }
    else {
        return false;
    }
}

<input type="text" onkeydown="return CheckNumerick(event);" />

l'essayer

Le code de la touche BackSpace est 8

event.key === "Retour arrière"

Plus récent et beaucoup plus propre: utilisation event.key. Fini les codes numériques arbitraires!

note.addEventListener('keydown', function(event) {
    const key = event.key; // const {key} = event; ES6+
    if (key === "Backspace") {
        // Do something
    }
});

Documents Mozilla

Navigateurs pris en charge

Utilisez à la place l'un des événements keyup / keydown / beforeinput.

sur la base de cette référence, la pression de touche est obsolète et n'est plus recommandée.

L'événement keypress est déclenché lorsqu'une touche qui produit une valeur de caractère est enfoncée. Les clés alphabétiques, numériques et de ponctuation sont des exemples de clés qui produisent une valeur de caractère. Les touches de modification telles que Alt, Maj, Ctrl ou Meta sont des exemples de touches qui ne produisent pas de valeur de caractère.

si vous utilisez "beforeinput", faites attention à sa compatibilité avec le navigateur . la différence entre "beforeinput" et les deux autres est que "beforeinput" est déclenché lorsque la valeur d'entrée est sur le point de changer, donc avec des caractères qui ne peuvent pas changer la valeur d'entrée, il n'est pas déclenché (par exemple shift, ctr, alt).

J'ai eu le même problème et en utilisant keyup, il a été résolu.