javascript十个最常用的自定义函数

核心提示：如果不使用类库或者没有自己的类库，储备一些常用函数总是有好处的，javascript十个最常用的自定义函数，(10)addEvent网上最流行的版本是Scott Andrew的，据说javascript界曾举行一场比赛（此事件我们可以在Pro Javascript Techniques第100页看到）或浏览PPK的网站

如果不使用类库或者没有自己的类库，储备一些常用函数总是有好处的。

(10)addEvent

网上最流行的版本是Scott Andrew的，据说javascript界曾举行一场比赛（此事件我们可以在Pro Javascript Techniques第100页看到）或浏览PPK的网站，征求添加事件与移除事件的函数，他就是其获奖者。下面就是他的实现：

01.function addEvent(elm, evType, fn, useCapture) {
02.　　if (elm.addEventListener) {
03.　　　　elm.addEventListener(evType, fn, useCapture);//DOM2.0
04.　　　　return true;
05.　　}
06.　　else if (elm.attachEvent) {
07.　　　　var r = elm.attachEvent('on' + evType, fn);//IE5+
08.　　　　return r;
09.　　}
10.　　else {
11.　　　　elm['on' + evType] = fn;//DOM 0
12.　　}
13.}

下面是Dean Edwards 的版本

01.// addEvent/removeEvent written by Dean Edwards, 2005
02.// with input from Tino Zijdel
03.// http://dean.edwards.name/weblog/2005/10/add-event/
04.function addEvent(element, type, handler) {
05.　　　　//为每一个事件处理函数分派一个唯一的ID
06.　　　　if (!handler.$$guid) handler.$$guid = addEvent.guid++;
07.　　　　//为元素的事件类型创建一个哈希表
08.　　　　if (!element.events) element.events = {};
09.　　　　//为每一个"元素/事件"对创建一个事件处理程序的哈希表
10.　　　　var handlers = element.events[type];
11.　　　　if (!handlers) {
12.　　　　　　　　handlers = element.events[type] = {};
13.　　　　　　　　//存储存在的事件处理函数(如果有)
14.　　　　　　　　if (element["on" + type]) {
15.　　　　　　　　　　　　handlers[0] = element["on" + type];
16.　　　　　　　　}
17.　　　　}
18.　　　　//将事件处理函数存入哈希表
19.　　　　handlers[handler.$$guid] = handler;
20.　　　　//指派一个全局的事件处理函数来做所有的工作
21.　　　　element["on" + type] = handleEvent;
22.};
23.//用来创建唯一的ID的计数器
24.addEvent.guid = 1;
25.function removeEvent(element, type, handler) {
26.　　　　//从哈希表中删除事件处理函数
27.　　　　if (element.events && element.events[type]) {
28.　　　　　　　　delete element.events[type][handler.$$guid];
29.　　　　}
30.};
31.function handleEvent(event) {
32.　　　　var returnValue = true;
33.　　　　//抓获事件对象(IE使用全局事件对象)
34.　　　　event = event || fixEvent(window.event);
35.　　　　//取得事件处理函数的哈希表的引用
36.　　　　var handlers = this.events[event.type];
37.　　　　//执行每一个处理函数
38.　　　　for (var i in handlers) {
39.　　　　　　　　this.$$handleEvent = handlers[i];
40.　　　　　　　　if (this.$$handleEvent(event) === false) {
41.　　　　　　　　　　　　returnValue = false;
42.　　　　　　　　}
43.　　　　}
44.　　　　return returnValue;
45.};
46.//为IE的事件对象添加一些“缺失的”函数
47.function fixEvent(event) {
48.　　　　//添加标准的W3C方法
49.　　　　event.preventDefault = fixEvent.preventDefault;
50.　　　　event.stopPropagation = fixEvent.stopPropagation;
51.　　　　return event;
52.};
53.fixEvent.preventDefault = function() {
54.　　　　this.returnValue = false;
55.};
56.fixEvent.stopPropagation = function() {
57.　　　　this.cancelBubble = true;
58.};