投稿者 tel | 2014年7月31日

JavaScriptでキー入力の押した時、離した時を取得する

イベントのkey downだとキーリピートで押している間、何もイベントが来てしまう。
ゲームなどでキー入力を扱う場合はキーを押した時、押している間、離した時を取得したい。

まずはあるフレームでボタンが押された状態か離された状態かを判定する。
keydownで押されたキーを記録してkeyupで解除する。記録されたキーの値を見れば押された状態かどうか判断できる。
フレームの更新でキーの状態をチェックする。前フレームのキー状態と比較して押した時、離した時を判断する。

var keyState = [],
    prevKyeState = [],
    keyDowns = [],
    keyUps = [];
			
function UpdateKey() {
    var changes = [];
    for(var k in keyState) {
        changes[k] = keyState[k] ^ prevKyeState[k];
        keyDowns[k] = changes[k] & keyState[k];
        keyUps[k] = changes[k] & !keyState[k];
        prevKyeState[k] = keyState[k];
    }
}

document.addEventListener('mousedown', function(e) {
    keyState[e.keyCode] = true;
});
document.addEventListener('keyup', function(e) {
    keyState[e.keyCode] = false;
});

上記のコードでUpdateKeyをマイフレーム呼び出して、keyDownsとkeyUpsを見ればOK。


コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中

カテゴリー

%d人のブロガーが「いいね」をつけました。