JavaScriptでキーボード入力を行う方法は？

Question

私は矢印キーを押すと、特定の形状の形状の変化につながるのJavaScript、キーボード入力をしたいです。どのようにJavaScriptのキーの入力を取るのですか？

Answer 1

文書で、またはキーストロークを観察したい要素をregistering an event handlerで、key related properties of the event objectを調べることができます。 FFとのWebkitベースのブラウザで動作

例：

document.addEventListener('keydown', function(event) { 
    if(event.keyCode == 37) { 
     alert('Left was pressed'); 
    } 
    else if(event.keyCode == 39) { 
     alert('Right was pressed'); 
    } 
}); 

DEMO

Answer 2

ブラウザでこれをやっている場合は、キーボードイベントをキャプチャすることができます。

• のKeyDown
• 打鍵
• からkeyup

は、すべてのほとんどのブラウザでHTMLノード上に聴くことができます。

のWebkitもサポートしています...

• にtextInput

あなたは、ウィンドウ上のイベント・ハンドラまたはあなたがしたい任意の要素を登録する必要があります詳細を読むためにhttp://unixpapa.com/js/key.html

Answer 3

を参照してください。上のキーストロークを観察し、とキーコードの代わりに標準key valuesを使用しています。 MDNからこの修正されたコードは、左、右、上、または矢印キーダウンを押すとKeyDownイベントに応答します：

window.addEventListener("keydown", function (event) { 
 
    if (event.defaultPrevented) { 
 
    return; // Do nothing if the event was already processed 
 
    } 
 

 
    switch (event.key) { 
 
    case "ArrowDown": 
 
     // code for "down arrow" key press. 
 
     break; 
 
    case "ArrowUp": 
 
     // code for "up arrow" key press. 
 
     break; 
 
    case "ArrowLeft": 
 
     // code for "left arrow" key press. 
 
     break; 
 
    case "ArrowRight": 
 
     // code for "right arrow" key press. 
 
     break; 
 
    default: 
 
     return; // Quit when this doesn't handle the key event. 
 
    } 
 

 
    // Cancel the default action to avoid it being handled twice 
 
    event.preventDefault(); 
 
}, true); 
 
// the last option dispatches the event to the listener first, 
 
// then dispatches event to window