Question Comment détecter les touches d'échappement avec JS ou jQuery?


Dupliquer possible:
Quel code clé pour la clé d'échappement avec jQuery 

Comment détecter les touches de raccourci dans IE, Firefox et Chrome? Le code ci-dessous fonctionne dans IE et les alertes 27, mais dans Firefox, il alerte 0

$('body').keypress(function(e){
    alert(e.which);
    if(e.which == 27){
        // Close my modal window
    }
});

415
2017-07-30 07:54


origine


Réponses:


Il semble keydown et keyup travail, même si keypress Peut-être pas


$(document).keyup(function(e) {
     if (e.keyCode == 27) { // escape key maps to keycode `27`
        // <DO YOUR WORK HERE>
    }
});

Quel code clé pour la clé d'échappement avec jQuery


789
2017-07-30 07:59



le keydown l'événement fonctionnera très bien pour Escape et a l'avantage de vous permettre d'utiliser keyCode dans tous les navigateurs. En outre, vous devez attacher l'écouteur à document plutôt que le corps.

MISE À JOUR Mai 2016

keyCode est maintenant en train d'être déprécié et la plupart des navigateurs modernes offrent le key propriété maintenant, bien que vous ayez toujours besoin d'une solution de repli pour un support de navigateur décent pour l'instant (au moment de la rédaction, les versions actuelles de Chrome et Safari ne le supportent pas).

document.onkeydown = function(evt) {
    evt = evt || window.event;
    var isEscape = false;
    if ("key" in evt) {
        isEscape = (evt.key == "Escape" || evt.key == "Esc");
    } else {
        isEscape = (evt.keyCode == 27);
    }
    if (isEscape) {
        alert("Escape");
    }
};
Click me


154
2017-07-30 08:18



En utilisant JavaScript vous pouvez faire vérifier le travail jsfiddle 

document.onkeydown = function(evt) {
    evt = evt || window.event;
    if (evt.keyCode == 27) {
        alert('Esc key pressed.');
    }
};

En utilisant jQuery vous pouvez faire vérifier le travail jsfiddle 

jQuery(document).on('keyup',function(evt) {
    if (evt.keyCode == 27) {
       alert('Esc key pressed.');
    }
});

27
2017-07-11 06:06



vérifier keyCode && which & keyup || keydown

$(document).keydown(function(e){
   var code = e.keyCode || e.which;
   alert(code);
});

14
2017-07-30 07:57



Le meilleur moyen est de faire fonctionner pour cela

FONCTION:

$.fn.escape = function (callback) {
    return this.each(function () {
        $(document).on("keydown", this, function (e) {
            var keycode = ((typeof e.keyCode !='undefined' && e.keyCode) ? e.keyCode : e.which);
            if (keycode === 27) {
                callback.call(this, e);
            };
        });
    });
};

EXEMPLE:

$("#my-div").escape(function () {
    alert('Escape!');
})

6
2017-11-19 14:00



Ci-dessous le code qui non seulement désactive la touche ESC mais vérifie également la condition où il est pressé et selon la situation, il fera l'action ou pas.

Dans cet exemple,

e.preventDefault();

désactivera l'action de pression sur la touche ESC.

Vous pouvez faire quelque chose comme cacher une div avec ceci:

document.getElementById('myDivId').style.display = 'none';

Lorsque la touche ESC appuyée est également prise en compte:

(e.target.nodeName=='BODY')

Vous pouvez supprimer cette partie condition si vous souhaitez appliquer à tout cela. Ou vous pouvez cibler INPUT ici pour appliquer cette action uniquement lorsque le curseur est dans la zone de saisie.

window.addEventListener('keydown', function(e){
    if((e.key=='Escape'||e.key=='Esc'||e.keyCode==27) && (e.target.nodeName=='BODY')){
        e.preventDefault();
        return false;
    }
}, true);

5
2018-01-03 04:07



Je pense que le moyen le plus simple est le javascript vanilla:

document.onkeyup = function(event) {
   if (event.key === 27){
     //do something here
   }
}

2
2017-11-30 22:08