Web 技术研究所

我一直坚信着,Web 将会成为未来应用程序的主流

对事件模型基类的小封装

  由于经常要写一些基于事件机制的库或框架,每次单独去实现既浪费时间又不容易维护。所以我把事件模型封装成了个小小的基类和大家分享下。几乎是模拟jQuery接口的语法来写的,不过由于是基于JavaScript对象的,所以没有DOM的冒泡机制之类的东西。
  下载地址:http://www.web-tinker.com/files/EventModel.1.0.js
  演示代码: <script src="http://www.web-tinker.com/files/EventModel.1.0.js"></script>
<script>
//这个O是我们要封装的东西,它需要事件支持
var O=function(){};
//我们可以直接对其原型指定上EventModel的实例来实现
O.prototype=new EventModel;
//这样O这个构造器的实例就可以使用事件机制了
var o=new O;

//事件响应函数
var f=function(e){
  console.log(e);
};

//绑定单个事件
o.on("test",f);
//绑定多个事件
o.on("test1 test2",f);
//绑定事件命名空间
o.on("test.abc.def",f);
//Map方式绑定
o.on({
  "t1":f,
  "t2":f
});

//注销单个事件
o.off("test",f);
//注销多个事件
o.off("test1 test2",f);
//注销某个事件上所有函数
o.off("test.abc.def");
//Map方式注销
o.off({
  "t1":f,
  "t2":null //注销所有t2
})

//绑定个用于测试的事件
o.on("test.1.2.3.4",f);

//触发单个事件(可以触发所有test[.*]的事件)
o.trigger("test",["参数列表(正常触发)"]);
//触发多个事件
o.trigger("test1 test2",["参数列表"]);
//调用方式触发(直接在本次消息中执行事件函数)
o.trigger("test",["参数列表(直接触发)"],true);
</script>

  其它说明:支持链式调用;事件函数中的this指向调用trigger的对象;trigger的参数列表以apply的形式传输。   
网名:
34.203.213.*
电子邮箱:
仅用于接收通知
提交 悄悄的告诉你,Ctrl+Enter 可以提交哦
神奇海螺
[查看全部主题]
各类Web技术问题讨论区
发起新主题
本模块采用即时聊天邮件通知的模式
让钛合金F5成为历史吧!
次碳酸钴的技术博客,文章原创,转载请保留原文链接 ^_^