Maison > interface Web > js tutoriel > Résumé des événements du clavier dans jquery_jquery

Résumé des événements du clavier dans jquery_jquery

WBOY
Libérer: 2016-05-16 15:13:55
original
1313 Les gens l'ont consulté

1. La première chose que vous devez savoir est :

1.keydown()
L'événement keydown sera déclenché lorsque le clavier est enfoncé.

2. touche()
L'événement keyup sera déclenché lorsque la touche est relâchée, c'est-à-dire l'événement après avoir appuyé sur le clavier et vous être levé

3. pression sur une touche()
L'événement keypress est déclenché lorsqu'une touche est enfoncée. Nous pouvons le comprendre comme appuyer et soulever la même touche

.

2. Obtenez le code asciII correspondant sur le clavier :

$(document).keydown(function(event){ 
alert(event.keyCode); 
}); 
Copier après la connexion

$tips : Dans l'exemple ci-dessus, event.keyCode peut nous aider à obtenir les touches sur lesquelles nous avons appuyé sur le clavier. Il renvoie le code ASCII, comme les touches haut, bas, gauche et droite, qui sont 38, 40, et 37 respectivement.

3. Exemple (en appuyant sur les touches gauche et droite du clavier)

Le code est le suivant :

$(document).keydown(function(event){ 
//判断当event.keyCode 为37时(即左方面键),执行函数to_left(); 
//判断当event.keyCode 为39时(即右方面键),执行函数to_right(); 
 if(event.keyCode == 37){ 
    to_left(); 
    }else if (event.keyCode == 39){
    to_right(); 
    } 
    else if (event.keyCode == 38){ 
    to_top(); 
    } 
    else if (event.keyCode == 40){ 
    to_bottom();
    } 
}); 

function to_left(){ $(".abc").css({'left':'-=10'});}

function to_right(){ $(".abc").css({'left':'+=10'});}

function to_top(){$(".abc").css({'top':'-=10'});}

function to_bottom(){$(".abc").css({'top':'+=10'});}
Copier après la connexion

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal