当输入处于焦点时防止按键事件触发

Question

我目前正在使用开关在按下某个键时触发一些代码。 这不是确切的代码，但它基本上是我正在使用的（这只是为了在这里保持简短和简单。）

$(document).keydown(function(e) {
switch(e.keyCode) { 

case 39:
e.preventDefault();
    alert("Arrow Key");

break;

case 37:
   e.preventDefault();
    alert("Arrow Key");
}
});

当输入框处于焦点时，如何防止事件触发？

Answer 1

我认为您的意思是仅当目标元素不是input标签时才要执行e.preventDefault() 。 你可以这样做：

$(document).keydown(function(e) {
    if (e.target.nodeName.toLowerCase() !== 'input') {
        switch(e.keyCode) { 
            case 39:
                e.preventDefault();
                alert("Arrow Key");

                break;

            case 37:
                e.preventDefault();
                alert("Arrow Key");
        }
    }
});

e.target是事件起源的元素。 或者，您可以使用 jQuery 的事件委托 API：

$(document).delegate(':not(input)', 'keydown', function(e) {
    switch(e.keyCode) { 
        case 39:
            e.preventDefault();
            alert("Arrow Key");

            break;

        case 37:
            e.preventDefault();
            alert("Arrow Key");
    }
});

编辑更新了我的答案以进行“不是输入”而不是“是输入”检查。

Answer 2

您可以使用document.activeElement返回当前聚焦的元素。

来自MDN的简短文档：

返回当前获得焦点的元素，即如果用户键入任何键，将获得击键事件的元素。 该属性是只读的。

也就是说，为了防止在输入焦点时触发击键事件，您可以忽略焦点元素是input时的击键事件处理

if (!$(document.activeElement).is("input"){ /* handle keystroke events here */ }

Answer 3

可能有更优雅的方式，但我会做这样的事情：

var inputHasFocus = false;
$("#some_input_id").focusin(function () {
    inputHasFocus = true;
}).focusout(function () {
    inputHasFocus = false;
});

然后在你的案例陈述中使用它。