javascript - 分配 "/"热键以在搜索框上创建焦点用户

Question

我正在构建的网站顶部有一个搜索栏。与 Trello 或 Gmail 类似，我希望当用户按下“/”键时，他们的焦点就会转到该搜索框。

我的 JavaScript 看起来像这样:

document.onkeydown = checkShortcuts;
function checkShortcuts(event) {
    console.log(event.keyCode);
    if (event.keyCode == 191) {  // 191 == "/" key
        var text_input = document.getElementById ('sitesearch');
        text_input.focus ();
        text_input.select ();
        $('#sitesearch').val("");
    }
}

我遇到的问题是，按下/键后，焦点不仅放在我的搜索栏中，而且“/”字符也显示在我的搜索栏中。我尝试通过执行 jquery .val("") 来删除它，但这是在输入字母之前进行的。

如果我将 onkeydown 移至 onkeyup，那么当我输入“/”时，我会在 Firefox 中看到快速查找窗口，这也不是我想要的。

有什么想法可以设置焦点但不在文本字段中键入该字符吗？

Answer 1

如果你已经混合了 JS/jQuery，你可以让它更短，例如

$(document).keydown(function() {
  if(event.keyCode == 191) {
     $('#sitesearch').focus();
     return false;
  }
});