as3 rollOver or mouseOver使用说明

所以当监听MouseEvent.ROLL_OVER事件后，鼠标移动到panel的几个按钮时，程序仍然认为鼠标悬停在panel上方。假设我们监听MouseEvent.MOUSE_OVER, 随着鼠标移到panel的按钮上，程序立刻判断鼠标离开了panel，已经到了按钮上方——这个结果不是我们需要的，此时本应去单击按钮，结果程序判断鼠标离开panel，会直接removeChild或者visible=false。

关于冒泡的话，不得不提AS3的事件流，简单的说就是一个捕捉——目标——冒泡的循环过程：事件发生后，先从显示层中的根容器开始往下层级逐个捕捉直至到达派发事件的目标对象后向上返回冒泡，而这一事件中的target属性始终指向最内层的派发事件目标，currentTarget则顾名思义指向事件流中当前所在的对象。
事件发生后，从根节点到目标节点的父节点，这中间所有节点都有两次机会可以响应事件，分别在捕获和冒泡阶段。在事件流经过的任意节点上注册侦听器都会触发。当然前提是打开了捕获和冒泡功能。

默认情况下，捕获功能处于关闭状态，因为实际开发中，监听目标很明确，没必要捕获。
而事件只有在bubbles属性为true时才进行冒泡，默认冒泡的事件包括：change，click，doubleClick，keyDown，keyUp，mouseDown，mouseUp。一旦捕获打开，默认的冒泡将被取消。
因此在同一个监听器中不能同时打开捕获和冒泡，只能注册两个监听一个开捕获一个开冒泡才行。
只有可视化对象（容器，控件）才有捕获和冒泡阶段，而像XML，WebService等非可视化对象只有目标阶段。

注册侦听器方法为：
addEventListener(type:String, listener:Function, useCapture:Boolean=false, priority:int=0, useWeakReference:Boolean=false)
useCapture即为是否打开捕获功能，
priority为优先级设定，当有多个侦听器时，priority越大，优先级越高越先调用，如果同级的话则按注册的顺序来调用。这里注意即使优先级有先后也无法保证后一个侦听调用执行时前一个侦听函数已执行完毕。
useWeakReference为弱引用开关，推荐设为true，便于垃圾自动回收。但最规范的还是直接removeEventListener。注意当注册监听器打开了捕获，则removeEventListener(type:String, listener:Function, useCapture:Boolean=false)的useCapture必须设为true，否则无效

事件对象的构造方法为：
Event(type:String, bubbles:Boolean=false, cancelable:Boolean=false)
bubbles即为是否冒泡
cancelable为true时可以调用PreventDefault方法停止系统默认的行为。比如输入文本，默认行为会马上显示在文本区，当cancelable为true时调用PreventDefault方法让字符不出现。
另外，Event还有两个方法可以停止事件流的继续传播，stopPropagation和stopImmediatePropagation，区别在于前者不会停止正在处理的对象。而后者还会停止同一object上的其他侦听器。

赞 (0)

相关推荐

  • 兼容ie和firefox的鼠标经过(onmouseover和onmouseout)实现--简短版

    前段时间一直找这个的简短实现  网上也有很多方法 昨天发现了这种方法 感觉是用代码最少的 呵呵 ie下支持css的js ff等支持:hover 就这样了 觉得好的就顶起来 无标题文档 #b_g_date tr{ event:expression(onmouseover = function(){this.style.backgroundColor='#E3FFC9'},onmouseout = function(){this.style.backgroundColor='#FFFFFF'});

  • jQuery中mouseover事件用法实例

    本文实例讲述了jQuery中mouseover事件用法.分享给大家供大家参考.具体分析如下: 当鼠标指针位于匹配的元素上方或者调用mouseover()方法时触发mouseover事件. 一个完整的事件过程,不但要有能够触发事件的条件,而且还要有事件处理程序. 可以通过mouseover()方法为mouseover事件绑定事件处理程序.例如: 复制代码 代码如下: $("div").mouseover(function(){$("div").text("我

  • 鼠标经过子元素触发mouseout，mouseover事件的解决方案

    我想实现的目标:当鼠标进入黑色框时,橙色框执行淡入动画:当黑色框范围移动的时候(即使经过粉色框,动画仍然不被触发):当鼠标移出的时候,橙色方块消失. 遇到的问题阐述:当鼠标移入黑色框的时候,橙色框执行淡入动画,但是当鼠标从黑色框经过粉色框的时候,橙色框就消失了,然后又执行一遍淡入动画.当鼠标从粉色框移出到黑色框的时候,橙色框的淡入动画又被执行.这不是我想要的. 初期代码: <!DOCTYPE html> <html> <head> <script src=&quo

  • javascript mouseover、mouseout停止事件冒泡的解决方案

    在IE里有onmouseleave和onmouseenter, 而对于要兼容各大浏览器的Web开发人员来说还是一件头疼的事. 虽然网上已经有针对Mozilla Firefox的一些计策,但代码量也是不容乐观的. 想寻求比较好的解决方案,于是就翻遍了国内的大小网站,终一无所获,不得不硬着头皮去读国外网站,结果是理想的,因为W3C里有relatedTarget,于是就有了下边的解决方案: 复制代码 代码如下: function isMouseLeaveOrEnter(e, handler) { if

  • JS小功能(onmouseover实现选择月份)实例代码

    JS小功能(onmouseover实现选择月份)实例代码

    效果: 代码: 复制代码 代码如下: <head runat="server">    <title></title>    <style type="text/css">        #backcolor        {            width: 400px;            height: 400px;            background: #FFFF00;            tex

  • 经过绑定元素时会多次触发mouseover和mouseout事件

    javascript的mouseover和mouseout事件,在绑定元素内部有子元素的情况下, 经过绑定元素时会多次触发mouseover和mouseout事件. jquery解决办法: jquery的mouseenter和mouseleave方法已经修复了这个问题,可以直接用来替代mouseover和mouseout 不过有个mouseenter和mouseleave有个小问题是,让鼠标从文档外直接进入绑定事件的元素时,mouseenter不生效 暂时解决办法是,别让绑定事件的元素靠浏览器边

  • IE中鼠标经过option触发mouseout的解决方法

    本文实例讲述了IE中鼠标经过option触发mouseout的解决方法.分享给大家供大家参考.具体分析如下: 要实现的功能: 有一个DIV,当鼠标经过时此DIV完全展开,当鼠标移开时DIV收缩回去,其中DIV里面有一个select选择框: 操作select的时候在IE中会出现一个问题,当鼠标经过option时,DIV会收缩回去,而在其他浏览器中无此现象. 解决的方法: 在IE中,当鼠标移到option时 window.event.toElement 的值为null,在其他浏览器中的值为objec

  • onmouseover和onmouseout的一些问题思考

    onmouseover和onmouseout的一些问题思考

    一个DIV层,当鼠标移进的时候会触发onmouseover,移出的时候会触发onmouseout.  很简单的逻辑,这也是我们想要的!但随之烦恼也就来了:onmouseover并不会只在移进时才触发,onmouseout也不会只在移出时才触发!鼠标在DIV里面移动时也会可能触发onmouseover或onmouseout.  在上图中,对于'A'来说:当鼠标进入'A'(路径'1′)时那么就会触发'A'的onmouseover事件:接着鼠标移动到'B'(路径'2′),此时'A'会触发onmouse

  • 扩展Jquery插件处理mouseover时内部有子元素时发生样式闪烁

    解决思路如下: 首先,判断事件的当前节点,也就是jquery的currentTarget是否在target的包含中,即下面的扩展$.containsNode. 然后,在调用hover的时候的mouseover和mouseout事件里判断currentTarget是否在target的包含中,即$.fn.fhover扩展 下面就是相关代码: 复制代码 代码如下: $.containsNode = function(parentNode, childNode) { if (parentNode.con

  • as3 rollOver or mouseOver使用说明

    所以当监听MouseEvent.ROLL_OVER事件后,鼠标移动到panel的几个按钮时,程序仍然认为鼠标悬停在panel上方.假设我们监听MouseEvent.MOUSE_OVER, 随着鼠标移到panel的按钮上,程序立刻判断鼠标离开了panel,已经到了按钮上方--这个结果不是我们需要的,此时本应去单击按钮,结果程序判断鼠标离开panel,会直接removeChild或者visible=false. 关于冒泡的话,不得不提AS3的事件流,简单的说就是一个捕捉--目标--冒泡的循环过程:事

  • 关于数据库连接池Druid使用说明

    根据综合性能,可靠性,稳定性,扩展性,易用性等因素替换成最优的数据库连接池. Druid:druid-1.0.29 数据库 Mysql.5.6.17 替换目标:替换掉C3P0,用druid来替换 替换原因: 1.性能方面 hikariCP>druid>tomcat-jdbc>dbcp>c3p0 .hikariCP的高性能得益于最大限度的避免锁竞争. 2.druid功能最为全面,sql拦截等功能,统计数据较为全面,具有良好的扩展性. 3.综合性能,扩展性等方面,可考虑使用druid或

  • AS3.0 实例学习 熟悉addChild和removeChild在不同的swf之间的运用，以及loader的用法

    案例2:熟悉addChild和removeChild在不同的swf之间的运用,以及loader的用法 说明:点击picture会载入另一个swf,点击载入的swf上的一个按钮,该swf消失. 演示:http://www.live-my-life-with-yuyi.com/as3_cases/different_movies/ 代码: swfA(也就是按钮所在的flash) 复制代码 代码如下: var loader:Loader = new Loader();  loader.load(new

  • Linux 新的API signalfd、timerfd、eventfd使用说明

    三种新的fd加入linux内核的的版本: signalfd:2.6.22 timerfd:2.6.25 eventfd:2.6.22 三种fd的意义: lsignalfd 传统的处理信号的方式是注册信号处理函数:由于信号是异步发生的,要解决数据的并发访问,可重入问题.signalfd可以将信号抽象为一个文件描述符,当有信号发生时可以对其read,这样可以将信号的监听放到select.poll.epoll等监听队列中. ltimerfd 可以实现定时器的功能,将定时器抽象为文件描述符,当定时器到期

  • 关于事件mouseover ,mouseout ,mouseenter,mouseleave的区别

    最近在做的在线考试和课程商城都遇到这样的问题:就是鼠标滑过的时候出现一个层,当鼠标滑到当前层的话mouseover和mouseout在低版本的浏览器会出现闪动的现象,解决这个现象的办法有许多,不过我觉得有一种是最简单的那就是把mouseover和mouseout换成对应的mouseenter和mouseleave. 当鼠标指针位于元素上方时,会发生 mouseover 事件. 该事件大多数时候会与 mouseout 事件一起使用. 注释:与 mouseenter 事件不同,不论鼠标指针穿过被选元

  • JS中mouseover和mouseout多次触发问题如何解决

    JS中mouseover和mouseout多次触发问题如何解决

    问题描述 我希望当鼠标移动到id1上的时候,id2显示,当鼠标离开id1的时候,id2显示.问题如下: 1.当鼠标从id1上移动到id2上的时候,id由有显示变为不显示,然后变为显示 2.当鼠标从id2上移动到id1上的时候, id2有显示变为不显示,然后变为显示 我希望的是当鼠标在id1或者id2上移动的时候,id2一直显示,不发生变化. <script type="text/javascript" src="https://code.jquery.com/jquer

  • 基于Bootstrap的标签页组件及bootstrap-tab使用说明

    基于Bootstrap的标签页组件及bootstrap-tab使用说明

    bootstrap-tab bootstrap-tab组件是对原生的bootstrap-tab组件的封装,方便开发者更方便地使用,主要包含以下功能: tab页初始化 关闭tab页 新增tab 显示tab页 获取tab页ID 使用 Step1 :引入样式 <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css" rel="external nofollow" > <

  • 跨浏览器的 mouseenter mouseleave 以及 compareDocumentPosition的使用说明

    写了这么久 js应用 我居然不知道这两个事件 于是 去google搜索了一番. 才发现这两个事件 是如此的优秀 且好用... 但搜索过程中 发现 好多人 似乎不太明白这两个事件 和mouseover mouseout 真正的区别 和用途..  并且看到google中搜索得到的 一些朋友 实现的 跨浏览器 解决方案. 觉得似乎有些繁琐...所以产生了写一篇blog 把这玩意 说透彻的冲动... 好啦.我们进入正题. 对于 mouseover 和mouseenter 两个事件 最大的区别就是 mou

随机推荐