首页 > 代码库 > js自定义事件模式
js自定义事件模式
---恢复内容开始---
js事件用的最多的就是默认事件。不过有时候需要自定义事件来使用。
参照默认事件的模式,例如click事件,鼠标点击dom,先触发click事件,然后执行dom上的事件处理程序。
<p>点我</p>
document.getElementByTagName(‘p‘)[0].addEventLisener(‘click‘,()=>{
alert(‘click‘);
})
同理,自定义事件也需要三个部分,即事件注册、事件触发、处理程序。
这里使用原型方法做例:
var ZdsEvent=function(){ //自定义事件对象
return;
};
ZdsEvent.prototype={ //原型对象
handles:{ //事件处理程序
},
on(zdsEvent,handle){ //事件注册
if(!this.handles[zdsEvent]){
this.handles[zdsEvent]=handle;
}else{
console.log(‘这个事件已经注册过了‘);
};
},
emit(zdsEvent){ //事件触发
if(this.handles[zdsEvent]){
this.handles[zdsEvent]();
}else{
console.log(‘还没有注册这个事件呢‘);
}
}
}
var zds=new ZdsEvent(); //实例事件对象
zds.on(‘con‘,()=>{ //注册一个打印内容事件
console.log(‘第一个事件‘)
});
zds.emit(‘con‘); //触发事件
这就是一个自定义事件的最基本模式,还有一些其他的功能,如注销事件和一次性事件等,不过最基本的功能就是这样
js自定义事件模式