模拟“ontype”事件答案

【问题标题】：Simulate an "ontype" event模拟“ontype”事件
【发布时间】：2012-03-22 17:56:02
【问题描述】：

我想模拟谷歌搜索的效果，即使搜索框没有聚焦，用户也可以开始输入，输入框会捕获所有的键盘敲击。

我已寻找ontype 事件，但没有找到任何东西。我知道click 等事件的回调中的event 对象具有键盘信息，但我认为这不是我想要的。

【问题讨论】：

onkeypress 或 onkeyup 怎么样
更新了我的答案。显然不需要捕捉角色，改变目标就可以了。
再次更新了我的答案。 :) 我希望这次是决赛。
您也可以接受自己的答案。但是，如果您接受我的，我将不胜感激:)

【解决方案1】：

这样就可以了：

 $(document).on('keydown', function() {
     $('input').focus();
 });

【讨论】：

是的，这将起作用，但由于您的输入是document 的一部分，因此每次您在输入字段中输入内容时，此函数也会运行，并将焦点放在已经具有焦点的输入上。还有另一种更优雅的方式。我将进一步增强我的答案。

【解决方案2】：

HTML：

<input type="text" id="txtSearch" />

Javascript：

var googleLikeKeyCapture = {
    inputField : null,
    documentKeydown: function(event) {
        var inputField = googleLikeKeyCapture.inputField;
        if(event.target != inputField.get(0)) {
            event.target = inputField.get(0);
            inputField.focus();
        }
    },
    init: function() {
        googleLikeKeyCapture.inputField = $('#txtSearch');
        $(document).bind('keydown', googleLikeKeyCapture.documentKeydown);
        googleLikeKeyCapture.inputField
            .focus(function() {
                $(document).unbind('keydown');
            })
            .blur(function() {
                $(document).bind('keydown', googleLikeKeyCapture.documentKeydown);
            });
        googleLikeKeyCapture.init = function() {};
    }
};

$(googleLikeKeyCapture.init);

你也可以找到 jsFiddle 例子here

编辑：

现在是jQuery plugin。 :) 如果 keydown 发生在 textarea 或输入字段中，它不会捕获键，其他任何内容都会转到指定的输入字段。如果您的选择器匹配多个元素，它只使用第一个元素。

用法：$('#txtSearch').captureKeys();

【讨论】：

googleLikeKeyCapture.init = function() {}; 行是什么？避免内存泄漏？
这是一种习惯。它可以防止多次初始化对象。

【解决方案3】：

您关注的事件是onkeypress。

【讨论】：

【解决方案4】：

试试这个 jQuery 文本更改事件插件：

http://www.zurb.com/playground/jquery-text-change-custom-event

【讨论】：