javascript事件绑定的this

Question

转：oneroom

javascript事件绑定的this

在javascript的事件绑定中，我们经常用到的方法是

1. function addListener(el, event, fn, bCapture){
2.     var isCapture = bCapture ? bCapture : false;
3.     try {
4.        el.addEventListener(event, fn, isCapture);
5.     }
6.     catch (e) {
7.         try {
8.             el.attachEvent('on' + event, fn);
9.         }
10.         catch (e) {
11.             el['on' + event] = fn;
12.         }
13.     }
14. }
15. function whatIsThis(){
16.     if (this === window) {
17.         alert('This is a window object');
18.     }
19.     alert('So, This.tagName is:'+ '‘'+ this.tagName +'’。');
20. }

复制代码addListener(spanEl, 'click', whatIsThis);
但是这个存在一个问题，就是事件处理函数fn中this的指向在不同的浏览器（firefox和ie）中有不同的含义，在ie中this指向的是window对象，这个是不可理解的，一般来说this都是指向当前的元素。

解决办法:

1如果只有一个事件绑定，可以采用elem.onclick=function（e）{};

2

1. function addEvent(el, event, fn, obj, overrideContext, bCapture){
2.     var context = el, isCapture = bCapture ? bCapture : false, wrappedFn = null;
4.     if (overrideContext) {
5.         if (overrideContext === true) {
6.             context = obj;
7.         }
8.         else {
9.             context = overrideContext;
10.         }
11.     }
12.     wrappedFn = function(){
13.         return fn.call(context);
14.     };
15.     try {
16.         el.addEventListener(event, wrappedFn, isCapture);
17.     }
18.     catch (e) {
19.         try {
20.             el.attachEvent('on' + event, wrappedFn);
21.         }
22.         catch (e) {
23.             el['on' + event] = wrappedFn;
24.         }
25.     }
26. }

复制代码