Javascript-HTML Select：消除浏览器按键更改时的延迟？

考虑以下HTML：

<select>
    <option>Aardvark</option>
    <option>Buffalo</option>
    <option>Camel</option>
    <option>X-ray Fish</option>
    <option>Yak</option>
    <option>Zebra</option>
</select>

在大多数浏览器中,当select元素具有焦点时,按一个键会将所选值更改为以键入的字符开头的下一个选项.例如,在键盘上同时按< select>时按键盘上的“ B”.上方具有焦点的元素将所选值更改为“ Buffalo”.之后按“ Z”将值更改为“ Zebra”.

但是我发现,至少在我PC上的Firefox 6和Safari 5中,有一个延迟,之后我才可以按键选择下一个值.在上面的特定示例中,如果我按下“ B”然后不到一秒钟再按下“ Z”,则似乎什么也没有发生.

但是,在进一步的测试(使用jQuery)中,我发现Java事件’keydown’,’keyup’和’keypress’均按照您的期望触发,无论您按下按键的速度如何.浏览器本身只是在经过一定时间后才切换所选选项.

有什么办法可以解决这个问题？

解决方法:

我通过中断keyevent并在函数顶部放置了preventDefault()来做到这一点.我使用Enter键打破延迟,然后提交我已经输入的内容.

if (eventinfo.keyCode == 13) {
    eventinfo.preventDefault();
    var search = document.getElementById("searchtag");
    var value = search.value;
    mainPage.searchAdd(value).done(
        function () {
           search.value = "";
           search.focus();
        }
    );
}

标签：dom,html-select,html,javascript
来源： https://codeday.me/bug/20191102/1989628.html