javascript - 我正在重写原来的 .focus() 方法。有什么办法可以让我继续这样做，而不破坏原来的行为

Question

几个月前，我为我的工作制作了一个 Javascript 库，现在看起来它的事件处理程序有问题，问题是我通过使用 fireEvent 方法有一个触发事件函数，效果很好，我有这样的东西:

["focus", "click", "blur", ...].each(function(e){
    MyEvents[e] = function(fn){
        if(!fn){
            trigger(element, e);
        } else {
            addEvent(element, e, fn);
        }
    }
});

当然这只是一个想法，原始函数要大得多...好吧，正如您所注意到的，我为所有标准事件创建了一个自定义函数，所以我只是将其称为“element.click(function.. .);所以...

问题是现在如果我执行“input.focus();”它没有获得焦点，但它触发了事件，我该怎么做才能使元素真正获得焦点？也许从数组中删除焦点？如果我这样做，我是否还必须删除一些其他事件，例如提交、模糊等？

谢谢，实际上该库正在测试中，因此需要尽快纠正这个错误。

再次感谢您。

Answer 1

要获得元素处于焦点 -(即不触发事件本身，而是聚焦元素)，您可以使用 .focus() 方法。

您不能使用上面列出的函数来执行此操作，因为它仅分配事件..

你只需做这样的事情:

document.getElementById('#inputbox').focus();

是的，就这么简单

当然，我不知道你一开始是如何引用这些元素的。

在评论中澄清后

我要重申一下你的问题: “我正在重写原来的 .focus() 方法。有什么方法可以让我继续这样做，而不破坏原来的行为吗？”

是的:)

这是一个示例 - 因为我不知道您的变量或任何内容，所以我正在为此示例动态创建一个元素 - 这不是必需的:

e = document.createElement('input');
document.body.appendChild(e);
// note: I'm using .focus() just because it was easier for me to debug.. you 
// just as well replace it with .blur() instead.
e.focus = function () {
    HTMLInputElement.prototype.focus.apply(this, arguments);
}    
e.focus();

JS fiddle 链接:http://jsfiddle.net/DK8M7/

好吧，我不确定您熟悉多少个变量。我给出一个概述:

• HTMLInputElement 是所有输入元素的原始对象的名称(将其视为“类名称”)
• .prototype 是一个对象，引用在所有已创建或尚未创建的对象之间共享的静态对象。有点像起源。
• .apply() 是一种用于从特定上下文调用函数的方法 - 也就是说，您选择它的“this”对象，后一个参数是其参数的数组
• arguments 是一个特殊的 JavaScript 数组，可从所有函数访问，其中包含所有参数的数组。

有关 apply 方法的更多信息: https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function/apply

重写所有输入元素的blur()方法

还有一件事...如果您希望所有输入元素都具有此行为，最简单的方法是实际上覆盖它的原型(prototype)...所以既然我们走在这条路上，这你会这样做:

HTMLInputElement.prototype.blurCpy = HTMLInputElement.prototype.blur;

HTMLInputElement.prototype.blur = function () {
    HTMLInputElement.prototype.blurCpy.apply(this, arguments);
}    

干杯..