ホームページ > ウェブフロントエンド > jsチュートリアル > jquery_jquery のキーボード イベントの概要

jquery_jquery のキーボード イベントの概要

WBOY
リリース: 2016-05-16 15:13:55
オリジナル
1295 人が閲覧しました

1. まず知っておくべきことは次のとおりです:

1. キーダウン()
キーボードが押されると、keydown イベントがトリガーされます。

2. キーアップ()
keyup イベントは、キーが放されたとき、つまりキーボードを押して立ち上がった後のイベントがトリガーされます

3. キープレス()
keypress イベントは、キーがタップされたときにトリガーされ、同じキーを押したり離したりすると理解できます。

2. キーボードで対応する asciII コードを取得します。

$(document).keydown(function(event){ 
alert(event.keyCode); 
}); 
ログイン後にコピー

$tips: 上記の例では、event.keyCode はキーボードでどのキーが押されたかを取得するのに役立ちます。たとえば、上下左右のキーは 38、40、それぞれ 37;

3. 例(キーボードの左右のキーを押す場合)

コードは次のとおりです:

$(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'});}
ログイン後にコピー

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート