JS - 入力フィールドが選択されると、EventListenerを無効にします。

Question

現在、私はドキュメントにEventListenerを追加しています。これは次のコードを使用して素晴らしい作品：

document.addEventListener('keydown', function(event) 
{ 
    if(event.keyCode === 68){ 
     socket.emit('keyPress', {inputId: 'right', state: true}); 
    } 
    else if(event.keyCode === 83){ 
     socket.emit('keyPress', {inputId: 'down', state: true}); 
    } 
    else if(event.keyCode === 65){ 
     socket.emit('keyPress', {inputId: 'left', state: true}); 
    } 
    else if(event.keyCode === 87){ 
     socket.emit('keyPress', {inputId: 'up', state: true}); 
    } 
}); 

document.addEventListener('keyup', function(event) 
{ 
    if(event.keyCode === 68){ 
     socket.emit('keyPress', {inputId: 'right', state: false}); 
    } 
    else if(event.keyCode === 83){ 
     socket.emit('keyPress', {inputId: 'down', state: false}); 
    } 
    else if(event.keyCode === 65){ 
     socket.emit('keyPress', {inputId: 'left', state: false}); 
    } 
    else if(event.keyCode === 87){ 
     socket.emit('keyPress', {inputId: 'up', state: false}); 
    } 
}); 

をしかし、イベントリスナーがトリガされるだろう、その後D、Iは入力フィールドを選択し、W、A、Sを含むものを入力し、一度。

入力フィールドが選択されたら、eventListenerを無効にする方法はありますか？

Answer 1

入力からイベントのバブリングを無効にする必要があります。このような何か：

input.addEventListener('keyup', function (e) { 

    e.stopPropagation(); 

}, false); 
input.addEventListener('keydown', function (e) { 

    e.stopPropagation(); 

}, false); 

ですから、keyupと​​イベントバブリングを無効にし、それがある場合は、入力の誰親ノードは、

Answer 2

はいevent.targetが何であるかを確認し、これらのイベントを聞かないしません上記のコードを使用して、 input要素だけで戻り値を返し、そうでなければコードを続けさせます。

document.addEventListener('keydown', function(event) { 
    if(event.target === someReferenceToYourElement){ 
    return; 
    } 
    //rest of code 
}); 

Answer 3

入力のフォーカスにイベントリスナーを追加できます。

document.getElementsByTagName('input').addEventListener('focus', function(e) { 
    e.StopPropagation(); 
} 

Answer 4

私はそのような何かをあなたにお勧め：

$('document').keypress(function(event) { 
    if (event.which == 65) { // A 
     // Do your stuff 
    } 
}) 

このコードはentierであなたのが、DOMと同じです。あなたのフィールドは、文字Aが含まれている場合

$('#input').val.indexOf('a') 

このコードは、文字列「ABCD」または「バー」などをすることができ、チェックしますあなたはフィールドにすることができますフォーカスを失ったときにチェックしたい場合は

jqueryのイベントブラーもhttps://api.jquery.com/blur/