标签:style blog http color java io for ar 问题
在上篇中的事件绑定方法,相信大家都看到过了。
不过这里有点小小的问题,这些方法,变量都是全局的,难免会与其他的库或者方法发生冲突而被覆盖,因此,我在这里做了小小的封装,如下:
1
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 |
(function(window){
var Yx = function(){ } Yx.evGuid = 0; //绑定事件 Yx.prototype.bind = function(ele/*标签元素对象*/,evName/*方法名称,不带on前缀*/,evFunc/*方法*/){ if(!evFunc.$$guid) evFunc.$$guid = Yx.evGuid++;//为新添加的事件添加标识 if(!ele.events) ele.events = {};//为元素添加事件集合 evName = evName; if(!ele.events[evName]){ ele.events[evName] = {}; } if(ele.events[evName][evFunc.$$guid]==undefined) ele.events[evName][evFunc.$$guid] = {}; ele.events[evName][evFunc.$$guid] = evFunc; ele["on"+evName] = eventManager;//事件统一处理 } //解绑事件 Yx.prototype.unbind = function (ele/*标签元素对象*/, evName/*方法名称,不带on前缀*/, evFunc/*方法*/) { if(ele.events && ele.events[evName]){ delete ele.events[evName][evFunc.$$guid]; } } //事件管理 /* 这里是所有事件的入口函数,都是调用这个函数,通过它再调用对应函数 */ function eventManager(e){ var self = this;//当前对象 var e = e || window.event;//event对象 if(!e.stopPropagation){//IE下的阻止默认行为,事件冒泡 e.preventDefault = function() {this.returnValue = false;} e.stopPropagation = function() {this.cancelBubble = true;} } var evFuncs = self.events[e.type];//获取当前对象,指定的事件名称事件数组 for(var key in evFuncs){ evFuncs[key](e); } } window.yx = new Yx(); })(window); |
JavaScript Code
1
|
(function(window){/*...*/})(window);
|
这种写法是自执行函数,当函数创建后立刻执行,常用于创建命名空间
1
|
window.yx = new Yx();
|
在看这里,这里在window下定义了yx这个变量,其为YX这个类的一个对象,其实就是定义了一个名为yx的全局变量,这样我们就能通过yx.xxx来调用对应的方法了。语法如下:
1
2 3 4 5 6 7 |
var item = document.getElementById("test");//获取元素
yx.bind(item, "click", function (e) { //console.log("Div Click 1 !"); alert("Div Click 1 !"); e.stopPropagation(); }); |
标签:style blog http color java io for ar 问题
原文地址:http://www.cnblogs.com/urols-jiang/p/3935938.html