原生js：事件绑定（call，修改this指向）

js中的事件，通常有两种写法：

一、常规：o.onclcik=fn(){}     

常规方法比较好理解（通常事件前选用“on...” ie你懂得，其余的也能够兼容）

不过对一个对象进行相同事件处理的时候，容易引起方法覆盖

var div=document.getElementById("div1");
div.onclick=function(){ alert(1) }
div.onclick=function(){ alert(2) }
div.onclick=function(){ alert(3) }

只弹出3

 

二、事件绑定：

能够避免常规的方法覆盖，有利多人协做

在封装一些方法，须要后期修改“事件”的时候优点很明显

好如今聊聊浏览器兼容吧，额！！！！！！！！！！！！！！！！！ ！！！！！！！！！！！！！！！！！！！！！！！！！！！！！

ie：   o.attachEvent(ev,fn);（他命的是this指向，默认都是指向window的得call() “靠！”一下）

w3c:  o.addEventListener(ev,fn,false);  

像我这样倾向于用原生js的同窗们，封装是务必要作的工做，废话少说下面直接给方法：

function on(o,ev,fn){
	if(o.addEventListener){//ff，webkit
		o.addEventListener(ev,fn,false);
	}else if(o.attachEvent){//ie 8-
		o.attachEvent('on'+ev,function(){//默认指向window
			fn.call(o,arguments); //改变this指向
		});
	}
}

如今再试试：

on(div,"click",function(){alert(1)})
on(div,"click",function(){alert(2)})
on(div,"click",function(){alert(3)})

w3c：1，2，3

ie：3，2，1

说不上 完美！！！ 可是最起码都有啦

 

关于事件绑定和ie的this指向，我的感受这篇文章也是不错的attachEvent 中this指向 有兴趣能够看看