javascript – 是否可以在常规对象(而不是DOM对象)上分派事件?

这个问题在这里已经有一个答案:> Can plain Javascript objects have events?8
我只是发现FileReader调度事件就好像是一个DOM元素.是吗?我想知道是否可以创建一个类似于FileReader的对象,它在HTML / XML结构中没有表示,但是可以分派事件?

解决方法

FileReader有诸如addEventHandler的方法,因为它是 defined来实现 EventTarget接口. EventTarget由 DOM Events规范定义,但您不需要是实现它的DOM对象.窗口,XMLHttpRequest和FileReader是实现EventTarget的其他浏览器对象模型对象.

不幸的是,没有简单的方法来捎带浏览器的本机实现的事件目标…你可以尝试从浏览器对象继承使用一个作为原型属性,但这是非常不可靠的一般.但是,编写代码以简单的JavaScript来实现所有的方法并不难,

function CustomEventTarget() { this._init(); }

CustomEventTarget.prototype._init= function() {
    this._registrations= {};
};
CustomEventTarget.prototype._getListeners= function(type,useCapture) {
    var captype= (useCapture? '1' : '0')+type;
    if (!(captype in this._registrations))
        this._registrations[captype]= [];
    return this._registrations[captype];
};

CustomEventTarget.prototype.addEventListener= function(type,listener,useCapture) {
    var listeners= this._getListeners(type,useCapture);
    var ix= listeners.indexOf(listener);
    if (ix===-1)
        listeners.push(listener);
};

CustomEventTarget.prototype.removeEventListener= function(type,useCapture);
    var ix= listeners.indexOf(listener);
    if (ix!==-1)
        listeners.splice(ix,1);
};

CustomEventTarget.prototype.dispatchEvent= function(evt) {
    var listeners= this._getListeners(evt.type,false).slice();
    for (var i= 0; i<listeners.length; i++)
        listeners[i].call(this,evt);
    return !evt.defaultPrevented;
};

注意:上面的代码是我的头顶部,未经测试,但可能会工作.但是它有一些限制,如果Event对象支持DOM Level 3 defaultPrevented属性,而不支持DOM Level 3 stopImmediatePropagation()(这是不可能实现的,除非您依赖于自己的Event对象来显示它,否则支持dispatchEvent返回值)财产).还没有实现层次结构或捕获/冒泡.

所以海事组织:通过尝试编写参与DOM事件模型的代码,你不会有太多的收获.对于简单的JS回调工作,我只是随着你自己的临时执行监听器列表.

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...