- 浏览: 98258 次
- 性别:
- 来自: 北京
文章分类
最新评论
-
chensong215:
无法获取到ProgressEvent中的bytesTotal
自定义DownloadProgressBar -
qq2464785999:
非常感谢。
测试后,发现要用相对路径的话,好像要这么写
va ...
Flex写XML文件
as3.0中如何阻止事件冒泡?
as3.0中的事件冒泡机制有时候会很烦人,比如一个Sprite(方便下文描述就命名为Container吧)把另一外Sprite(称为Child吧)做为子元素套进来以后,如果两个Sprite都注册了Mouse_Down事件,要想在Child上点击鼠标时系统只响应Child的Mouse_Down事件,默认是不行的,因为事件冒泡会让Container也响应Mouse_Down事件,示例代码:
View Code?
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758 package{ import flash.display.*; import flash.events.MouseEvent; public class EventTest extends Sprite { public function EventTest() { var _container:Sprite = createRectangle(); var _child:Sprite = createRectangle(50,50,0x00ff00); var _sub_child:Sprite = createRectangle(25,25,0x0000ff); _child.addChild(_sub_child); _container.addChild(_child); addChild(_container); _container.y = _container.x = 50; _child.x = _container.width/2-_child.width/2; _child.y = _container.height/2-_child.height/2; _sub_child.x = _child.width/2-_sub_child.width/2; _sub_child.y = _child.height/2-_sub_child.height/2; _container.addEventListener(MouseEvent.MOUSE_DOWN,containerMouseDownHandler); _child.addEventListener(MouseEvent.MOUSE_DOWN,childMouseDownHandler); _sub_child.addEventListener(MouseEvent.MOUSE_DOWN,subChildMouseDownHandler); } private function subChildMouseDownHandler(e:MouseEvent):void{ trace("_sub_child.MOUSE_DOWN"); } private function subChildMouseDownHandler2(e:MouseEvent):void{ trace("_sub_child.MOUSE_DOWN_2"); } private function childMouseDownHandler(e:MouseEvent):void{ trace("_child.MOUSE_DOWN"); } private function containerMouseDownHandler(e:MouseEvent):void{ trace("_container.MOUSE_DOWN"); } private function createRectangle(width:uint=100,height:uint=100,color:uint=0xff0000):Sprite{ var s:Sprite = new Sprite(); s.graphics.beginFill(color,1); s.graphics.drawRect(0,0,width,height); s.graphics.endFill(); return s; } } }
鼠标点击最小的矩形后,输出如下:
_sub_child.MOUSE_DOWN
_child.MOUSE_DOWN
_container.MOUSE_DOWN
相当于点一个,触发了三个,要想阻止事件冒泡,可以调用e.stopImmediatePropagation()或stopPropagation()方法,即:
View Code?
123456 private function subChildMouseDownHandler(e:MouseEvent):void{ e.stopImmediatePropagation(); //或 //e.stopPropagation(); trace("_sub_child.MOUSE_DOWN"); }
这样在_sub_Child上点击时,另外二个Sprite就不会响应Mouse_Down事件,但是stopImmediatePropagation方法与stopPropagation有什么区别呢?Adobe总不至于傻到弄二个功能一样的东东吧
官方的解释:
stopImmediatePropagation():void
防止对事件流中当前节点中和所有后续节点中的事件侦听器进行处理。
stopPropagation():void
防止对事件流中当前节点的后续节点中的所有事件侦听器进行处理。
有点绕口, 还是直接来看代码吧,把上面的示例改造一下,让_sub_Child的Mouse_Down事件同时添加二个监听
View Code?
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859 package{ import flash.display.*; import flash.events.MouseEvent; public class EventTest extends Sprite { public function EventTest() { var _container:Sprite = createRectangle(); var _child:Sprite = createRectangle(50,50,0x00ff00); var _sub_child:Sprite = createRectangle(25,25,0x0000ff); _child.addChild(_sub_child); _container.addChild(_child); addChild(_container); _container.y = _container.x = 50; _child.x = _container.width/2-_child.width/2; _child.y = _container.height/2-_child.height/2; _sub_child.x = _child.width/2-_sub_child.width/2; _sub_child.y = _child.height/2-_sub_child.height/2; _container.addEventListener(MouseEvent.MOUSE_DOWN,containerMouseDownHandler); _child.addEventListener(MouseEvent.MOUSE_DOWN,childMouseDownHandler); //注意:这里同时添加了二个监听,并设置了优点级(subChildMouseDownHandler2的优先级高于subChildMouseDownHandler1) _sub_child.addEventListener(MouseEvent.MOUSE_DOWN,subChildMouseDownHandler1,false,1); _sub_child.addEventListener(MouseEvent.MOUSE_DOWN,subChildMouseDownHandler2,false,2); } private function subChildMouseDownHandler1(e:MouseEvent):void{ trace("_sub_child.MOUSE_DOWN_1"); } private function subChildMouseDownHandler2(e:MouseEvent):void{ trace("_sub_child.MOUSE_DOWN_2"); } private function childMouseDownHandler(e:MouseEvent):void{ trace("_child.MOUSE_DOWN"); } private function containerMouseDownHandler(e:MouseEvent):void{ trace("_container.MOUSE_DOWN"); } private function createRectangle(width:uint=100,height:uint=100,color:uint=0xff0000):Sprite{ var s:Sprite = new Sprite(); s.graphics.beginFill(color,1); s.graphics.drawRect(0,0,width,height); s.graphics.endFill(); return s; } } }
重复刚才的测试,在最小的矩形_sub_Child上点击,输入如下:
_sub_child.MOUSE_DOWN_2
_sub_child.MOUSE_DOWN_1
_child.MOUSE_DOWN
_container.MOUSE_DOWN
然后把subChildMouseDownHandler2改成:
View Code?
1234 private function subChildMouseDownHandler2(e:MouseEvent):void{ e.stopImmediatePropagation(); trace("_sub_child.MOUSE_DOWN_2"); }
重复刚才的测试,输出如下:
_sub_child.MOUSE_DOWN_2
再试下stopPropagation方法
?1234 private function subChildMouseDownHandler2(e:MouseEvent):void{ e.stopPropagation(); trace("_sub_child.MOUSE_DOWN_2"); }
这回输出不同了:
_sub_child.MOUSE_DOWN_2
_sub_child.MOUSE_DOWN_1
小结:如果某对象的一个事件同时添加多个监听,stopPropagation将把该事件注册的所有监听处理函数执行完后,再阻止该事件继续向上冒泡;而stopImmediatePropagation方法将本次处理函数执行完后就立即阻止事件继续向上冒泡(即同一事件的其它监听函数将不会执行)。
作者:菩提树下的杨过
出处:http://yjmyzz.cnblogs.com
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
as3.0中的事件冒泡机制有时候会很烦人,比如一个Sprite(方便下文描述就命名为Container吧)把另一外Sprite(称为Child吧)做为子元素套进来以后,如果两个Sprite都注册了Mouse_Down事件,要想在Child上点击鼠标时系统只响应Child的Mouse_Down事件,默认是不行的,因为事件冒泡会让Container也响应Mouse_Down事件,示例代码:
View Code?
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758 package{ import flash.display.*; import flash.events.MouseEvent; public class EventTest extends Sprite { public function EventTest() { var _container:Sprite = createRectangle(); var _child:Sprite = createRectangle(50,50,0x00ff00); var _sub_child:Sprite = createRectangle(25,25,0x0000ff); _child.addChild(_sub_child); _container.addChild(_child); addChild(_container); _container.y = _container.x = 50; _child.x = _container.width/2-_child.width/2; _child.y = _container.height/2-_child.height/2; _sub_child.x = _child.width/2-_sub_child.width/2; _sub_child.y = _child.height/2-_sub_child.height/2; _container.addEventListener(MouseEvent.MOUSE_DOWN,containerMouseDownHandler); _child.addEventListener(MouseEvent.MOUSE_DOWN,childMouseDownHandler); _sub_child.addEventListener(MouseEvent.MOUSE_DOWN,subChildMouseDownHandler); } private function subChildMouseDownHandler(e:MouseEvent):void{ trace("_sub_child.MOUSE_DOWN"); } private function subChildMouseDownHandler2(e:MouseEvent):void{ trace("_sub_child.MOUSE_DOWN_2"); } private function childMouseDownHandler(e:MouseEvent):void{ trace("_child.MOUSE_DOWN"); } private function containerMouseDownHandler(e:MouseEvent):void{ trace("_container.MOUSE_DOWN"); } private function createRectangle(width:uint=100,height:uint=100,color:uint=0xff0000):Sprite{ var s:Sprite = new Sprite(); s.graphics.beginFill(color,1); s.graphics.drawRect(0,0,width,height); s.graphics.endFill(); return s; } } }
鼠标点击最小的矩形后,输出如下:
_sub_child.MOUSE_DOWN
_child.MOUSE_DOWN
_container.MOUSE_DOWN
相当于点一个,触发了三个,要想阻止事件冒泡,可以调用e.stopImmediatePropagation()或stopPropagation()方法,即:
View Code?
123456 private function subChildMouseDownHandler(e:MouseEvent):void{ e.stopImmediatePropagation(); //或 //e.stopPropagation(); trace("_sub_child.MOUSE_DOWN"); }
这样在_sub_Child上点击时,另外二个Sprite就不会响应Mouse_Down事件,但是stopImmediatePropagation方法与stopPropagation有什么区别呢?Adobe总不至于傻到弄二个功能一样的东东吧
官方的解释:
stopImmediatePropagation():void
防止对事件流中当前节点中和所有后续节点中的事件侦听器进行处理。
stopPropagation():void
防止对事件流中当前节点的后续节点中的所有事件侦听器进行处理。
有点绕口, 还是直接来看代码吧,把上面的示例改造一下,让_sub_Child的Mouse_Down事件同时添加二个监听
View Code?
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859 package{ import flash.display.*; import flash.events.MouseEvent; public class EventTest extends Sprite { public function EventTest() { var _container:Sprite = createRectangle(); var _child:Sprite = createRectangle(50,50,0x00ff00); var _sub_child:Sprite = createRectangle(25,25,0x0000ff); _child.addChild(_sub_child); _container.addChild(_child); addChild(_container); _container.y = _container.x = 50; _child.x = _container.width/2-_child.width/2; _child.y = _container.height/2-_child.height/2; _sub_child.x = _child.width/2-_sub_child.width/2; _sub_child.y = _child.height/2-_sub_child.height/2; _container.addEventListener(MouseEvent.MOUSE_DOWN,containerMouseDownHandler); _child.addEventListener(MouseEvent.MOUSE_DOWN,childMouseDownHandler); //注意:这里同时添加了二个监听,并设置了优点级(subChildMouseDownHandler2的优先级高于subChildMouseDownHandler1) _sub_child.addEventListener(MouseEvent.MOUSE_DOWN,subChildMouseDownHandler1,false,1); _sub_child.addEventListener(MouseEvent.MOUSE_DOWN,subChildMouseDownHandler2,false,2); } private function subChildMouseDownHandler1(e:MouseEvent):void{ trace("_sub_child.MOUSE_DOWN_1"); } private function subChildMouseDownHandler2(e:MouseEvent):void{ trace("_sub_child.MOUSE_DOWN_2"); } private function childMouseDownHandler(e:MouseEvent):void{ trace("_child.MOUSE_DOWN"); } private function containerMouseDownHandler(e:MouseEvent):void{ trace("_container.MOUSE_DOWN"); } private function createRectangle(width:uint=100,height:uint=100,color:uint=0xff0000):Sprite{ var s:Sprite = new Sprite(); s.graphics.beginFill(color,1); s.graphics.drawRect(0,0,width,height); s.graphics.endFill(); return s; } } }
重复刚才的测试,在最小的矩形_sub_Child上点击,输入如下:
_sub_child.MOUSE_DOWN_2
_sub_child.MOUSE_DOWN_1
_child.MOUSE_DOWN
_container.MOUSE_DOWN
然后把subChildMouseDownHandler2改成:
View Code?
1234 private function subChildMouseDownHandler2(e:MouseEvent):void{ e.stopImmediatePropagation(); trace("_sub_child.MOUSE_DOWN_2"); }
重复刚才的测试,输出如下:
_sub_child.MOUSE_DOWN_2
再试下stopPropagation方法
?1234 private function subChildMouseDownHandler2(e:MouseEvent):void{ e.stopPropagation(); trace("_sub_child.MOUSE_DOWN_2"); }
这回输出不同了:
_sub_child.MOUSE_DOWN_2
_sub_child.MOUSE_DOWN_1
小结:如果某对象的一个事件同时添加多个监听,stopPropagation将把该事件注册的所有监听处理函数执行完后,再阻止该事件继续向上冒泡;而stopImmediatePropagation方法将本次处理函数执行完后就立即阻止事件继续向上冒泡(即同一事件的其它监听函数将不会执行)。
作者:菩提树下的杨过
出处:http://yjmyzz.cnblogs.com
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
发表评论
-
flex 自定义多个命名空间以及标签名
2013-01-22 15:21 1276flex 自定义多个命名空 ... -
FLEX中使用AS动态创建DataGrid
2013-01-09 16:24 887FLEX中使用AS动态创建DataGrid 2010年2月6日 ... -
flex与flash之间相互调用
2012-12-12 12:39 613http://www.cnblogs.com/kaixuan/ ... -
Flex与Flex创建的swf通信
2012-12-12 10:16 709加载子SWF的Flex程序代码 <?xml vers ... -
[AS3]加载视频(FLV)文件
2012-12-06 15:11 848[AS3]加载视频(FLV)文件 分类: FLEX/CS3-- ... -
通过FileReference打开本地图片崩溃的解决方法
2012-12-06 14:02 706通过FileReference打开本地图片崩溃的解决方法 最近 ... -
使用FileReference的load()方法加载本地图片
2012-12-06 13:56 9011、要想使用FileReference的load()方法和da ... -
[AS3]Bitmap序列化(将BitmapData保存为原生Binary/ByteArray)
2012-12-06 13:48 750[AS3]Bitmap序列化(将BitmapData保存为原生 ... -
as3 画五角星算法
2012-12-05 16:49 2601as3 画五角星算法 阅读:10次 时间:2012-03- ... -
flex嵌入完整html
2012-11-29 11:18 803有时候我们需要在Flex应用中嵌入HTML代码,根据嵌入HTM ... -
flex4 textArea的htmlText属性
2012-11-29 11:13 3100它现在包含Text布局框架(Text Layout Frame ... -
Tooltip应用
2012-11-29 11:11 707创建ToolTip: var errorToolTip:To ... -
数据绑定显示问题
2012-10-27 12:11 640数据绑定实时变化。 XMLListCollection 可以变 ... -
待解决问题
2012-09-18 23:48 6961.仪表盘 2.渐变填充的使用 3.发光效果的完美运用 能在一 ... -
as3加载外部图片的两种方式
2012-09-09 11:46 991package net.burchin.loading { ... -
公式as3
2012-09-06 18:13 0as3 1人收藏此文章, 我要收藏 发表于1年前(2011-0 ... -
Flex中多线程的实现
2012-09-06 10:49 3472破阵子_如是我闻 如是我闻。一时佛在舍卫国,祗树给孤独园.. ... -
自定义column renderer
2012-08-09 15:07 905<?xml version="1.0" ... -
drowshadowFilter
2012-08-09 15:05 651DropShadowFilter 类,在Flash中为各种对象 ... -
123123
2012-08-08 17:16 0http://www.oschina.net/code/sni ...
相关推荐
一种解决事件冒泡的方法,有较好的浏览器兼容性,具体思路参见文档: http://blog.csdn.net/ivyandrich/article/details/22041933
阻止滚动条事件mousewheel冒泡,当网页内部元素滚动条到顶或底时不触发浏览器窗口的滚动条事件。
jquery阻止事件冒泡jquery阻止事件冒泡jquery阻止事件冒泡
JQuery 提供了两种方式来阻止事件冒泡。 方式一:event.stopPropagation(); 代码如下: $(“#div1”).mousedown(function(event){ event.stopPropagation(); }); 方式二:return false; 代码如下: $(“#div1”)....
js阻止冒泡及jquery阻止事件冒泡示例介绍.docx
什么是JS事件冒泡? 在一个对象上触发某类事件... 如何来阻止Jquery事件冒泡? 通过一个小例子来解释 代码如下: <%@PageLanguage=”C#”AutoEventWireup=”true”CodeFile=”Default5.aspx.cs\u201dInherits=
解决/阻止 div层内的div层点击事件冒泡触发的小方法 示例代码
jquery-事件冒泡jquery-事件冒泡jquery-事件冒泡jquery-事件冒泡jquery-事件冒泡jquery-事件冒泡jquery-事件冒泡jquery-事件冒泡jquery-事件冒泡jquery-事件冒泡jquery-事件冒泡jquery-事件冒泡jquery-事件冒泡...
JavaScript+jQuery 网页特效设计;鼠标事件;1、鼠标事件;1、鼠标事件(案例);2、键盘事件;2、键盘事件(案例);3、事件的冒泡与阻止;3、事件的冒泡与阻止;3、事件的冒泡与阻止;...3、事件的冒泡与阻止
1.阻止事件冒泡,使成为捕获型事件触发机制. function stopBubble(e) { //如果提供了事件对象,则这是一个非IE浏览器 if ( e && e.stopPropagation ) //因此它支持W3C的stopPropagation()方法 e.stopPropagation()...
JQuery 提供了两种方式来阻止事件冒泡.rar
<%@ Page Language=C# AutoEventWireup=true CodeFile=Default5.aspx.csInherits=Default5%> <!DOCTYPE ...<... <head runat=server>...Porschev--
js阻止冒泡 在阻止冒泡的过程中,W3C和IE采用的不同的方法,那么我们必须做以下兼容。 代码如下: function stopPro(evt){ var e = evt || window.event; //returnValue如果设置了该属性,它的值比事件句柄的返回值...
js阻止冒泡事件的方法有2种。 事件冒泡:当一个元素上的事件被触发时,同样的事件会在那个元素的所有祖先元素中被触发。 这个事件是从原始元素开始一直冒泡到DOM树最上层。 目标元素:任何一个事件的目标元素...
Actionscript 3.0 冒泡排序算法 主要介绍冒泡排序算法用Actionscript 3.0实现
主要介绍了jQuery事件绑定和解绑、事件冒泡与阻止事件冒泡及弹出应用,结合实例形式较为详细的分析了jQuery事件绑定、解绑、事件冒泡、阻止冒泡等相关原理与应用技巧,需要的朋友可以参考下
如何阻止事件的冒泡? 方式一:在事件的回调函数中加上return false; 方式二:在事件回调函数的形参列表中添加event,然后在回调函数中调用event.stopPropagation();. 事件的默认行为 什么是事件的默认行为? ...
主要给大家介绍了关于React中阻止事件冒泡问题的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用React具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
本文主要介绍了在点击div中的p时,如何阻止事件冒泡的方法,具有很好的参考价值,下面跟着小编一起来看下吧