THE HAM MEDIA BLOG

jQueryを使って押したキーの判定をする

Clip to Evernote このエントリーをはてなブックマークに追加
カテゴリ:
jQuery
タグ:
jquery
keydown
keypress

jQueryを使って押したキーの判定をする

キーボードを押した時の処理を出すために、キーを押した時にどのような値が帰ってくるのかをチェックしておこうかなと思い、アルファベッドの文字だけを判定する判定のスクリプトを書いてみた。



タイプしたキーの判定

jQuery 1.3.2 日本語リファレンスを参考にしつつ、サンプルを作ってみた。

jQuery(function($){
    $("div.preview input").keydown(function (e) {
		$("div.preview span#moji").text(e.keyCode);
		if (e.which == 32 
			|| (65 <= e.which && e.which <= 65 + 25) 
			|| (97 <= e.which && e.which <= 97 + 25)){
			var c = String.fromCharCode(e.which);
		}else{
			var c = "アルファベット以外のキー";
		};
		$("div.preview span#mcode").text(c);	
    });
});

■プレビュー

 ←ここで何かキーを押してみてね

押したキーは 

コードは 

上の方ででてくる文字、アルファベット以外をタイプしたときに、「アルファべット以外のキー」という表示がでるはずなのですが、押したキーによっては、なぜかアルファベットがでてくるのですが、そこは特に気にせず。

とりあえず、自分が調べたいキーの値がわかっただけでも、これを作ったかいがあったかな。

keydownとkeyupとkeypress

これのどれを選択したかと、ブラウザによっても取得できる値が変わってくるようだ。この点については要注意かも知れない。それぞれイベントを起こすタイミングが違ってくるのですが、キーの値も変わってくるのと、どれを使っていいのか迷うところでもある。よく調べてから実装したほうがよさそうだ。

トップ画のソース

Neon keyboard
Photographer
Anton GF
License
Creative Commons (by-nd)


この記事へのコメント
コメントを書く
お名前: [必須入力]

メールアドレス: [必須入力]

ホームページアドレス:

コメント: [必須入力]

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。

この記事へのトラックバック

トップに戻る

×

この広告は180日以上新しい記事の投稿がないブログに表示されております。