的JavaScript事件處理程序，但沒有輸入

Question

我已在事件處理程序如下

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

我怎麼防止它當一個輸入框的內部所產生

Answer 1

在您handleBodyKeyDown功能，檢查是否

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

（或'TEXTAREA'）。請使用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 
} 

---

附：如果你在頁面上有jQuery，你爲什麼使用addEventListener？在jQuery中，這一切都被整理出來給你：

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

Answer 2

在你handleBodyKeyDown方法，檢查是否該事件源於一個input元素：

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

    // do the rest of your code 
} 

注意，toUpperCase呼叫是必要的因爲確定tagName財產情況的條件相當複雜，有時幾乎無法控制。

請參閱event.target at MDN。

Answer 3

你可以這樣做：

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

Answer 4

有時（如我）最好不要，以防止它發生，但在事件的情況下，當它在輸入發生忽略。看起來這也是你的情況。

只要檢查evt.target || evt.srcElement屬性（現代框架爲你做這個標準化工作，所以很可能這將被稱爲目標），無論它是否是輸入。如果沒有，就忽略。

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（如果需要的話），你可以阻止它泡了：

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);