为什么我的输入字段中填充了生成焦点事件的键？

Question

我正在侦听 keydown 事件并检查它是否是 / 键。如果是，我想专注于文本输入。

我是这样做的：

 <input type="text" name="search" id="search" placeholder="Press '/' to search">

window.addEventListener('keydown', function(event){
    if(event.key === '/' || event.code === 'NumpadDivide'){
        document.getElementById("search").focus();
    }
})

上面的代码确实专注于输入，但它也插入了 / 用 / 键填充该输入。

下面是一个fiddle的代码：

https://jsfiddle.net/0v47rnxm/

Answer 1

因为您需要'prevent'按键的常规行为。尝试添加；

event.preventDefault()如下；

<input type="text" name="search" id="search" placeholder="Press '/' to search">

window.addEventListener('keydown', function(event){
    if(event.key === '/' || event.code === 'NumpadDivide'){
        event.preventDefault();
        document.getElementById("search").focus();
    }
})

为什么我的输入字段中填充了生成焦点事件的键？

Why does my input field is being populated with a key that generated a focus event?

javascript

focus

keyboard-events

dom-events