焦点触发的模糊事件

Question

我正在使用以下代码jsFiddle ：

function Field(args) {
    this.id = args.id;

    this.name = args.name ? args.name : null;
    this.reqType = args.reqType ? args.reqType : null;
    this.reqUrl = args.reqUrl ? args.reqUrl : null;
    this.required = args.required ? true : false;
    this.error = args.error ? args.error : null;

    this.elem = document.getElementById(this.id);
    this.value = this.elem.value;

    this.elem.addEventListener('blur', this, false);
    this.elem.addEventListener('focus', this, false);
}

// FormTitle is the specific field like a text field. There could be many of them.
function FormTitle(args) {
    Field.call(this, args);
}

Field.prototype.getValue = function() { return Helpers.trim( this.value ) };

Field.prototype.blur = function (value) {
    alert("blur");  
};

Field.prototype.focus = function (value) {
    alert("focus");  
};

Field.prototype.handleEvent = function(event) {
    var prop = event.type;
    if ((prop in this) && typeof this[prop] == "function")
        this[prop](this.value);
};

inheritPrototype(FormTitle, Field);
var title = new FormTitle({name: "sa", id: "title"});

function inheritPrototype(e, t) {
    var n = Object.create(t.prototype);
    n.constructor = e;
    e.prototype = n
}

if (!Object.create) {
    Object.create = function (e) {
        function t() {}
        if (arguments.length > 1) {
            throw new Error("Object.create implementation only accepts the first parameter.")
        }
        t.prototype = e;
        return new t
   }
}

问题是每次使该字段成为焦点时都会触发“模糊”事件，这与您的预期相反。 尽管代码中甚至没有提到焦点事件，但这是事实。 问题是我无法在 jsFiddle 中复制此问题，但问题发生在 IE 中。

此外，在 jsFiddle 上，还有另一个问题。 多次触发焦点事件...

对此有可能的解释和/或解决方案吗？

更新：

奖金问题（最后，承诺）。 我添加了一个函数 addEvent 来动态地将事件添加到表单字段，而不是直接在父构造函数中添加它们。 这是它的jsFiddle 。 我正在尝试调用该函数，但它似乎不起作用。 我可能做错了什么？

Answer 1

一旦获得焦点， focus处理程序中的alert就会立即将焦点从字段中移除。 失去焦点会触发blur 。 奇怪的是blur首先出现。

如果您将警报更改为console.log （或不会窃取焦点的内容），您将看到事件正确触发。

http://jsfiddle.net/rsKQq/4/