身体上のJavaScriptのイベントハンドラが、入力

Question

に私は、次のイベントハンドラ

document.addEventListener('keydown', handleBodyKeyDown, false);

どのように私はかどうかを確認、あなたのhandleBodyKeyDown関数内の入力ボックス

Answer 1

内場合に発生することを防ぐDOを持っていません

event.target.tagName.toUpperCase() == 'INPUT' 

（または'TEXTAREA'）。

注： IEの古いバージョンの場合は、event.srcElement.tagNameを使用してください。

ので、同様：

document.addEventListener('keydown', handleBodyKeyDown, false); 

function handleBodyKeyDown(event) 
{ 
    var e = event || window.event, 
     target = e.target || e.srcElement; 

    if (target.tagName.toUpperCase() == 'INPUT') return; 

    // Now continue with your function 
} 

---

P.S.ページにjQueryがある場合、なぜaddEventListenerを使用していますか？ jQueryのでは、このすべてはあなたのために整理します：toUpperCaseコールが必要であることを

function handleBodyKeyDown(event) { 
    if (event.target.tagName.toUpperCase() === 'INPUT') { 
     return; // do nothing 
    } 

    // do the rest of your code 
} 

注：お使いのhandleBodyKeyDown方法で

が

$(document).on('keydown', ':not(input)', function(e) 
{ 
    // Your code goes here... 
}); 

Answer 2

、イベントがinput要素で発信されたかどうかを確認しますtagNameプロパティの大文字と小文字を区別する条件は非常に複雑であり、制御できない場合もあります。

event.target at MDNを参照してください。発生することを防ぐために、それが入力で発生したイベントの場合、中に無視しない方が良いです（私になど）時には

handleBodyKeyDown = function(e) { 
    var e = e || window.event 
    if (e.target.tagName != "INPUT") { 
     // handle this since it isn't input 
    } 
} 

Answer 3

あなたのような何かを行うことができます。これもあなたのケースであるように見えます。

evt.target || evt.srcElementプロパティ（現代のフレームワークはこの正規化作業を行います。したがって、これは入力かどうかにかかわらず、おそらくターゲットと呼ばれます）。そうでない場合は無視してください。

Answer 4

：

Answer 5

QuirksModeは、イベントのターゲットを取得する方法を示します。

function doSomething(e) { 
    var targ; 
    if (!e) var e = window.event; 
    if (e.target) targ = e.target; 
    else if (e.srcElement) targ = e.srcElement; 
    if (targ.nodeType == 3) // defeat Safari bug 
     targ = targ.parentNode; 
    if(targ.tagName != "INPUT") { 
     //Perform your action here 
    } 
} 

ご質問はjQueryのタグ付けされて、あなただけのフレームワークがあなたのためにこれを正規化してevent.targetテストすることができ、その場合には：あなたは、入力されていないことを確認することができます。

$(document).bind("keydown", function (event) { 
    if(event.target.tagName != "INPUT") { 
     //Do something 
    } 
}); 

Answer 6

あなたがjQueryを使用している場合は、ターゲット要素をテストするためにis()メソッドを使用している、これを試すことができますinputが、その後何もしないです。

function handleBodyKeyDown(event) { 
    if ($(event.target).is("input")) { 
     return; 
    } 
    else{ 
     //Do your stuff here 
    } 
} 

Answer 7

いずれの場合でもHandleBodyKeyDown関数が呼び出されます。指定した方法で録音を呼び出すことはできません。これが '入力'かどうかを確認するロジックを追加するだけです。Additionaly（必要な場合）を使用すると、最大のバブルを防ぐことができます：あなたは（あなたがタグ付けされているが、あなたはまた、タグ付けされた2つの他のフレームワークを持っている）のプロトタイプを使用している場合は、イベントが1に登録してフィルタリングすることができ

function handleBodyKeyDown(ev) { 
    ev=ev||event; 
    var sender=ev.target||ev.srcElement; 
    if(sender.tagName.toLowerCase()==="input") { 
    if(ev.stopPropagation)ev.stopPropagation(); 
    else ev.cancelBubble=true; // for IE8 or less 
    return true; // do not prevent event from default action 
    } 
    // your code for global keydown 
} 

Answer 8

document.on('keydown', ':not(input)', handleBodyKeyDown);