web-dev-qa-db-fra.com

événement javascript e.which?

Quelle est la fonctionnalité de l'événement javascript e.which? Veuillez donner un bref exemple.

javascriptjavascript-events
66
minil

e.which n'est pas un événement, which est une propriété de l'objet event, que la plupart des gens appellent e dans leurs gestionnaires d'événements. Il contient le code de la touche sur laquelle vous avez appuyé pour déclencher l'événement (par exemple: keydown, keyup).

document.onkeypress = function(myEvent) { // doesn't have to be "e"
    console.log(myEvent.which);
};

Avec ce code, la console imprimera le code de n'importe quelle touche sur laquelle vous appuyez sur le clavier.

63
nickf

which est une propriété des objets Event. Il est défini pour les événements liés aux touches et à la souris dans la plupart des navigateurs, mais dans les deux cas, il n'est pas défini dans IE (avant la version 9).

Pour les événements liés à la souris, which spécifie le bouton de la souris impliqué. Pour IE <9, la valeur équivalente se trouve dans window.event.button. Juste pour compliquer les choses, les navigateurs non IE supportent également une propriété button des événements de souris qui rapporte parfois une valeur différente de which. De plus, les navigateurs ont parfois des valeurs différentes pour le même bouton ou la même combinaison de boutons. Si vous vous en tenez à utiliser which dans tous les navigateurs qui le prennent en charge et button dans IE <9, la seule constante est qu'une valeur de 1 signifie toujours le le bouton gauche de la souris était impliqué (mais pas nécessairement seul).

document.onmousedown = function(e) {
    e = e || window.event;
    var button = (typeof e.which != "undefined") ? e.which : e.button;
    if (button == 1) {
        alert("Left mouse button down");
    }
};

Pour une analyse complète, je recommande article de Jan Wolter sur les événements de souris JavaScript .

Pour les événements liés aux touches, which se rapporte à la touche qui a été enfoncée. Pour les événements keydown et keyup, c'est relativement simple: c'est le code de la touche enfoncée et renvoie la même valeur que la propriété keyCode de l'événement. Étant donné que tous les navigateurs prennent en charge la propriété keyCode et IE <9 ne prend pas en charge which, vous devez généralement utiliser keyCode pour keydown et keyup événements.

Pour les événements keypress, la situation est plus compliquée. Pour les touches de caractères imprimables, which est le code de caractère de la touche enfoncée et est pris en charge dans plus de navigateurs que la propriété charCode. Dans IE <9, l'équivalent est à nouveau la propriété keyCode. Ainsi, pour détecter le caractère tapé, voici une approche inter-navigateurs. Sachez que le code ci-dessous ne doit pas être utilisé pour les touches non imprimables telles que les touches fléchées, que vous devriez plutôt détecter dans l'événement keydown:

document.onkeypress = function(e) {
    e = e || window.event;
    var charCode = (typeof e.which == "number") ? e.which : e.keyCode;
    if (charCode) {
        alert("Character typed: " + String.fromCharCode(charCode));
    }
};

Encore une fois, pour plus de détails, je recommande article de Jan Wolter sur les événements clés JavaScript

77
Tim Down

Cette fonctionnalité a été supprimée des normes Web. Bien que certains navigateurs puissent toujours le prendre en charge, il est en cours de suppression. Ne l'utilisez pas dans des projets anciens ou nouveaux. Les pages ou les applications Web l'utilisant peuvent se casser à tout moment.

Tu devrais utiliser KeyboardEvent.key à la place, s'il est disponible.

http://codepen.io/KevinOrfas/pen/QKbKAd

7
KevinOrfas

Lors d'un événement, e:

e.which

est identique à:

e.keyCode

Ainsi, les deux fonctions vous permettent d'obtenir le code de touche de la touche enfoncée lors d'un événement de pression de touche, de pression de touche ou de touche

Beaucoup de gens utilisent || (OU) pour s'assurer que leur code fonctionne dans les navigateurs qui ne prennent pas en charge quelle propriété. Regardez le code ci-dessous:

document.onkeypress = function(e) {
   var key = e.which || e.keyCode;
   alert(key);
}
3
Sayanjyoti Das