JS 控件事件小结
2024-05-06 14:21:04
供稿：网友
概述：
事件对于控件来说至关重要，控件的消息通信机制使用事件的成本最低，但是对于JS控件来说有一些麻烦需要解决，JS类本身不支持事件，DOM模型支持的事件仅适应于浏览器的DOM节点。所以创建一套事件是我们写控件之前要做的。
事件机制
对于事件的机制我不想多说，各种语言中对事件的描述都很具体，都是观察者模式的一种实现，我们可以从中抽取出事件必须的接口（由于控件库是基于jQuery 所以接口跟jquery保持一致）：
1.on: 绑定事件
2.off: 删除事件
3.fire: 触发事件
4.addTarget : 添加冒泡的对象
5.publish: 允许事件冒泡
jQuery 中的事件
jQuery 中的事件功能缺失很丰富，但是必须是jQuery对象才支持，我们自己定义的控件类无法直接使用jQuery的事件，事件的上下文也有问题，所以我们需要自己封装控件的事件。
jQuery 中的 Callbacks 是 1.7中添加的用于回调的机制，使用起来很方便，但是问题也是指定上下文需要在触发时指定，我们可以将其封装到我们自己的事件类中。
绑定事件：
函数原型: function on(eventType,callback) 参数：
1.eventType : 事件类型
2.callback ： 回调函数
3.scope : 回调函数的上下文，这个变量在真正的控件绑定过程中使用的非常少，而且都有替代方案，所以为了简单起见，scope变量在此函数和下面的所有函数中就引入了。
上面回调函数的上下文是绑定事件的控件本身
删除绑定：
函数原型 ： function off(eventType,callback) 参数同上：
1.eventType : 事件类型
2.callback ： 回调函数，此变量省略时，删除这个事件类型的所有绑定函数。
在真正的控件开发和使用过程中，删除事件比绑定事件要麻烦的多，删除事件时，你需要有绑定事件时函数的引用，如果需要频繁删除添加同一个事件时请考虑使用delegate
触发事件
函数原型： fire(eventType) :
1. eventType : 事件类型，绑定到对象上的此类型的函数执行。
这里有2点需要注意：
1.触发事件的方式，我们这里使用 ‘stopOnFalse'的方式，也就是绑定在同一个事件类型下的函数顺序执行，如果有一个返回值为false，那么下面的函数终止执行。其他触发事件的方式参考 jquery 的 Callbacks 。
2.事件的是否冒泡执行，也就是说，如果一个控件有多个子控件，那么子控件触发点击事件时可以冒泡到父类控件，我们只需要监听父类的冒泡事件即可
事件冒泡
函数原型： function(eventType,bubble) ：
1.eventType : 事件类型
2.bubble : 是否冒泡
此函数与 function addTarget(control) 相匹配使用。
addTarget 添加事件冒泡到的对象上，控件实现中，默认指定控件的父控件作为其冒泡的对象。
