|
锁定老帖子 主题：了解DOM的事件流
精华帖 (0) :: 良好帖 (6) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
|---|---|
| 作者 | 正文 |
|
发表时间：2008-03-02
DOM事件标准定义了两种事件流，这两种事件流有着显著的不同并且可能对你的应用有着相当大的影响。这两种事件流分别是捕获和冒泡。和许多Web技术一样，在它们成为标准之前，Netscape和微软各自不同地实现了它们。Netscape选择实现了捕获事件流，微软则实现了冒泡事件流。幸运的是，W3C决定组合使用这两种方法,并且大多数新浏览器都遵循这两种事件流方式。
addListener: function(type, fn,setCapture){
if (this.addEventListener) this.addEventListener(type, fn, setCapture);
else {
this.attachEvent('on' + type, fn);
if (setCapture) this.setCapture(true);
}
return this;
} <body>
<div id="dd1-ct" style="width:400px;height:400px;border:1px solid #999;padding:2px">Container
<div id="dd1-item1" style="width:200px;height:200px;border:1px solid #999;padding:2px">Item1
<div id="dd1-item2" style="width:100px;height:100px;border:1px solid #999;padding:2px">Item2</div>
</div>
</div>
<div id='rh'></div>
</body>
fn1=function(e){
// e.stopPropagation();
$('rh').innerHTML+='Item1 clicked!******';
};
fn2=function(e){
// e.stopPropagation();
$('rh').innerHTML+='Item2 clicked!-------';
};
fn=function(e){
// e.stopPropagation();
$('rh').innerHTML+='Container clicked!&&&&&&&&';
};
$('dd1-item2').addListener('click', fn2.bindWithEvent(),false);
$('dd1-item1').addListener('click', fn1.bindWithEvent(),false);
$('dd1-ct').addListener('click', fn.bindWithEvent(),false);
b、ie6 $('dd1-item2').addListener('click', fn2.bindWithEvent(),true);
$('dd1-item1').addListener('click', fn1.bindWithEvent(),true);
$('dd1-ct').addListener('click', fn.bindWithEvent(),true);
$('dd1-item2').addListener('click', fn2.bindWithEvent(),true);
$('dd1-item1').addListener('click', fn1.bindWithEvent(),true);
$('dd1-ct').addListener('click', fn.bindWithEvent(),false);
$('dd1-item2').addListener('click', fn2.bindWithEvent(),true);
$('dd1-item1').addListener('click', fn1.bindWithEvent(),false);
$('dd1-ct').addListener('click', fn.bindWithEvent(),false);
谢谢hax的回复，纠正了我的错误。 声明：ITeye文章版权属于作者，受法律保护。没有作者书面许可不得转载。
推荐链接
|
| 返回顶楼 | |
|
发表时间：2008-03-02
IE的setCapture()跟capture事件流根本不是一回事情，楼主不要混淆了。
IE里只有bubble，不支持w3c标准的事件模型中的其他部分。 setCapture()是用来让一个元素截获一次超出其范围之外（甚至超出浏览器的范围，这显然可以用来干坏事，也许正是因此，ie7做了改变）的事件，但是通常这次事件结束后，setCapture会被自动复位。setCapture的用途主要是用于drag&drop。 |
| 返回顶楼 | |
|
发表时间：2008-03-03
hax 写道 IE的setCapture()跟capture事件流根本不是一回事情，楼主不要混淆了。
IE里只有bubble，不支持w3c标准的事件模型中的其他部分。 setCapture()是用来让一个元素截获一次超出其范围之外（甚至超出浏览器的范围，这显然可以用来干坏事，也许正是因此，ie7做了改变）的事件，但是通常这次事件结束后，setCapture会被自动复位。setCapture的用途主要是用于drag&drop。  你的意思是IE里就没有实现捕获事件流？
|
| 返回顶楼 | |
|
发表时间：2008-03-03
ronghao 写道 你的意思是IE里就没有实现捕获事件流？是的。setCapture()的含义是完全不同的。 |
| 返回顶楼 | |
|
发表时间：2008-03-03
谢谢hax的回复，重新编辑了。
|
| 返回顶楼 | |
浏览 5120 次
