取消冒泡和取消默认操作兼容浏览器的有关问题

2014-01-08

取消冒泡和取消默认操作兼容浏览器的问题?本帖最后由 u013346337 于 2014-01-02 16:43:44 编辑w3c中的取消

取消冒泡和取消默认操作兼容浏览器的问题?
本帖最后由 u013346337 于 2014-01-02 16:43:44 编辑 w3c中的取消默认操作事件:e.preventDefault();
w3c中的取消冒泡 :e.stopPropagation();
将IE中的取消默认操作和和取消冒泡也绑定到e.preventDefault();和e.stopPropagation();
代码如下:

html:


<title>event</title>
<script type="text/javascript" src="tool.js"></script>
<script type="text/javascript" src="demo.js"></script>
</head>
<body>
<input type="button" value="按钮" id="button" />
<a href="http://www.baidu.com" id="a">test</a>
</body>

tool.js:


//跨浏览器添加事件绑定
function addEvent(obj, type, fn) {
if (typeof obj.addEventListener != 'undefined') {
obj.addEventListener(type, fn, false);
} else {
if (!obj.events) obj.events = {};
if (!obj.events[type]) {
obj.events[type] = [];
//把第一次的事件处理函数先储存到第一个位置上
if (obj['on' + type]) obj.events[type][0] = fn;
} else {
//同一个注册函数进行屏蔽，不添加到计数器中
if (addEvent.equal(obj.events[type], fn)) return false;
}
//从第二次开始我们用事件计数器来存储
obj.events[type][addEvent.ID++] = fn;
//执行事件处理函数
obj['on' + type] = addEvent.exec;
}
}
//为每个事件分配一个计数器
addEvent.ID = 1;

//执行事件处理函数
addEvent.exec = function (event) {
var e = event || addEvent.fixEvent(window.event);
var es = this.events[e.type];
for (var i in es) {
es[i].call(this, e);
}
};
//同一个注册函数进行屏蔽
addEvent.equal = function (es, fn) {
for (var i in es) {
if (es[i] == fn) return true;
}
return false;
}
//把IE常用的Event对象配对到W3C中去
addEvent.fixEvent = function (event) {
 alert(this+'|');
event.preventDefault = addEvent.fixEvent.preventDefault;
event.stopPropagation = addEvent.fixEvent.stopPropagation;
return event;
};

//IE阻止默认行为
addEvent.fixEvent.preventDefault = function () {
this.returnValue = false;   
};

//IE取消冒泡
addEvent.fixEvent.stopPropagation = function () {
this.cancelBubble = true;
};

demo.js


window.onload = function () {
var oButton = document.getElementById('button');
var a = document.getElementById('a');
addEvent(a, 'click', function (e) {
e.preventDefault();
});
addEvent(oButton, 'click', function (e) {
e.stopPropagation();
alert('button');
});
addEvent(document, 'click', function () {
alert('document');
});
};

IE取消默认行为函数:addEvent.fixEvent.preventDefault和
IE取消冒泡的函数:addEvent.fixEvent.stopPropagation里的this是怎么传递的啊,指的是什么呢?这里不明白请教了....
这是别人的代码,当然还有别的实现方法,这里我只想知道this是指什么,怎么传的...
[解决办法]
1#还是没说到点。。

var e = event
[解决办法]
addEvent.fixEvent(window.event);

window.event相当于一个事件对象的实例，fixEvent动态给实例增加了方法，当通过实例调用新增的方法时，方法中this对象就是这个实例

下面这个应该好理解些

    function o() { }

    var _o = new o();
    _o.fun = function () { this.abc = 123; }
    _o.fun()
    alert(_o.abc)//123

    _o = new o();
    alert(_o.abc)//undefined

热点排行

JavaScript

取消冒泡和取消默认操作兼容浏览器的有关问题