将输入字段焦点设置为开始输入答案

【问题标题】：Set input field focus on start typing将输入字段焦点设置为开始输入
【发布时间】：2012-08-17 18:43:37
【问题描述】：

我正在寻找一种无需选择任何内容即可开始在网站上输入内容的方法，然后让特定的输入字段成为焦点。

Google 也采用了此功能。在他们的搜索结果中，您可以单击任意位置（使搜索字段失焦），当您开始输入时，它会自动再次聚焦在搜索字段上。

我正在考虑jQuery通用onkeyup函数专注于该领域，有什么建议吗？

非常感谢。

【问题讨论】：

标签： php javascript jquery search-engine setfocus

【解决方案1】：

您应该绑定keydown 事件，但立即解除绑定，以便在其他文本输入中继续输入，而不会将焦点恢复到默认输入。

$(document).bind('keydown',function(e){
    $('#defaultInput').focus();
    $(document).unbind('keydown');
});

See example here.

【讨论】：

一个不错的快捷方式是$(document).one('keydown',...)。
当您开始在另一个字段中输入时，这将自动聚焦在该输入上（即，通过鼠标为其提供焦点）。 -1 为此。请参阅我的答案以获得更好的解决方案。

【解决方案2】：

答案就这么简单：

$(document).keydown(function() { $('#element').focus(); });

keydown 是首选，因为 keyup 只会在按下第一个键后触发 - 并且分别不会捕获在我的搜索字段中键入的第一个键。

【讨论】：

这将在任何地方输入时自动关注该输入，包括其他输入或文本区域。

【解决方案3】：

此解决方案没有@mVChr 解决方案的问题：即您可以用鼠标单击另一个输入并开始输入而不会由于keydown-binding 而失去焦点。

此外，此解决方案不会删除所有元素的 keydown-bindings，而是使用命名处理程序。

var default_input_handler = function() {
    $('.default-input').focus();
    $(document).off('keydown', default_input_handler);
}

$(document).on('keydown', default_input_handler);

$('input, textarea, select').on('focus', function() {
    $(document).off('keydown', default_input_handler);
});

【讨论】：

【解决方案4】：

如果打算这样做，我会说使用 onKeyUp 而不是 onKeyDown。它在动作中更早，这将有助于简化交互流程。

【讨论】：

根据我目前对 jQuery 的理解，您必须将 onKeyUp 事件绑定到一个对象。你知道是否可以有一个“通用onKeyUp事件”吗？
绑定到document对象