天性/方法类型读 / 写描述
/*跨浏览器阻止事件冒泡*/functionstopPropagation{if(event.stopPropagation){event.stopPropagation();}else{event.cancelBubble=true;}}
回来javascript教程主目录>>
只要事件管理程序选取的是attachEvent()
,那么会有一个event
对象作为参数被传播到事件处理程序函数中,举个例子:
地点的事例中,钦赐的超链接在点击之后不会被导航到钦命的U索罗德L上。
随着是跨浏览器阻止事件暗中同意行为的形式。
最终是跨浏览器阻止事件冒泡的主意。
跨浏览器事件目的
最后,cancelBubble
属性与DOM中的stopPropagation()
主意同样,用于截至事件冒泡。由于IE不协理事件捕获,由此一定要用它来堵住事件冒泡。stopPropagation()
艺术能够同时收回事件冒泡和事件捕获。
假若是采用HTML属性来钦命事件管理程序,那么还是能由此四个event
变量来访谈event
对象,例如:
地方的代码中,第一个事件管理程序行使的是DOM0级事件管理程序,srcElement
质量等于this
。不过在其次个IE事件管理程序中,那八个值则是不一致的。
要阻止事件的暗中同意行为,能够运用preventDefault()
办法。举例,超链接的默许行为是在被单击的时候导航到某些UTucsonL上。假若想遏止超链接的私下认可行为,可以透过在超链接的onclick
事件处理程序中收回它,代码如下:
在事件管理程序的在这之中,对象this
一味等于curentTarget
的值,target
饱含的是事件的其实指标。
varlink=document.getElementById;link.onclick=function{event.preventDefault();}
varbtn=document.getElementById;/*DOM0级方法*/btn.onclick=function{console.info;//输出:“click”}/*DOM2级方法*/btn.addEventListener("click",function{console.info;//输出:“click”},false);
cancelBubbleBoolean只读是或不是撤除事件冒泡,默许值为false
,设置为true
时废除事件冒泡(与DOM中的stopPropagationreturnValueBoolean只读废除事件的私下认可行为,暗中同意值为true
,设置为false
时撤除暗许的平地风波作为(与DOM中的preventDefaultsrcElementElement只读事件的指标typeString只读被触发事件的项目
另外,只有在cancelable
属性棉被服装置为true
的时候,才得以行使preventDefault()
主意来废除私下认可行为。
IE中的事件目的
大家得以经过自定义函数来兑现跨浏览器的风云指标。
returnValue
质量约等于DOM中的preventDefault()
艺术,它的意义是打消事件的默许行为。要撤消事件的暗许行为,只须求将该属性的值设置为false
即可。例如:
因为事件处理程序的作用域是基于钦点它的点子来规定的,所以不可能感觉this
平昔等于事件目的。最棒应用event.srcElement
来判断。例如:
varbtn=document.getElementById;btn.onclick=function(){varevent=window.event;console.info;//输出"click"}
上一节我们学习了“JavaScript文档对象模型-DOM扩大”,介绍了DOM扩张的一些学问,后天最首要学习下JavaScript事件中的事件目的。
事件冒泡点击一下window.onload=function(){varelements=document.querySelectorAll;//alert;for(vari=0;i
varlink=document.getElementById;link.onclick=function(){window.event.returnValue=false;}
/*跨浏览器获取event对象*/functiongetEvent{returnevent?event:window.event;}
与访问DOM中的event
对象不一致,要拜望IE中的event
对象有两种分化的方法,决议于钦赐事件处理程序的法子。在选拔DOM0级方法增加事件管理程序时,event
对象作为window
目的的两天性质存在。比如下边包车型大巴事例:
能够看见,那时候,在调控高雄展现的风云指标独有按键对象。
事件冒泡点击一下window.onload=function(){varelements=document.querySelectorAll;//alert;for(vari=0;i
/*跨浏览器阻止事件默认行为*/functionpreventDefault{if{event.preventDefault();}else{event.returnValue=false;}}
stopPropagation()
艺术用于马上停下事件在DOM中的传播,也正是说能够撤除事件捕获或事件冒泡。比方上边包车型客车例证:
varbtn=document.getElementById;btn.onclick=function(){console.info(window.event.srcElement===this);//输出true}btn.attachEvent("onclick",function{console.info(event.srcElement===this);//输出false});
下一场是跨浏览器获取事件的靶子。
DOM中的事件目的
天性/方法类型读 / 写描述
地点的例证通过window.event
获取了event
指标,并得到了被触发事件的门类。
varbtn=document.getElementById;btn.attachEvent("onclick",function{console.info;//输出"click"});
IE中的event
指标也带有与创立它的平地风波有关的有个别性子和艺术。个中多数质量和情势都有对应或相关的DOM属性和办法。下表中列出了颇具事件目的都含有的属性和措施。
地方的代码会产闯祸件冒泡,从调节高雄得以见见事件冒泡的结果。假诺要注销事件冒泡,只要求加上event.stopPropagation();
即可。
event
指标富含与创立它的特定事件有关的性质和章程。触发事件的品种不均等,可用的属性和艺术也不相近。下表中列出了通用的性质和方法。
/*跨浏览器获取事件的目标*/functiongetTarget{returnevent.target?event.target:event.srcElement;}
bubblesBoolean只读事件是不是冒泡cancelableBoolean只读是还是不是可以撤消事件的私下认可行为curentTargetElement只读当前正在处管事人件的事件管理程序的因素detailInteger只读与事件相关的细节新闻eventPhaseInteger只读调用事件管理程序的阶段:1代表捕获阶段,2意味着“处于目的”阶段,3意味冒泡阶段preventDefault(卡塔尔(قطرFunction只读裁撤事件的暗中同意行为stopPropagation(卡塔尔Function只读裁撤事件的越来越捕获或冒泡。如果bubbles
为true
则还行该方法targetElement只读事件的对象typeString只读被触发事件的档次viewAbstractView只读与事件涉及的肤浅视图。等同于发惹祸变的window对象
事件目标的eventPhase
属性能够知晓当前正处在事件流的哪一个品级。如若eventPhase
属性的值等于1,那么事件流处于捕获阶段;假诺eventPhase
属性的值等于2,那么事件高居指标对象上;假使eventPhase
品质的值等于3,那么事件高居冒泡阶段。
首先是跨浏览器获取是事件目的的方法。该情势重回对event
目标的引用。
全部宽容DOM的浏览器都会将三个event
对象传入到事件管理程序中。不管是DOM0级事件管理方法大概DOM2级事件管理方法,都会传来event
对象。例如
在触发DOM中的某些事件的时候,会发生一个事变指标event
,这一个指标包罗着具备与事件有关的音讯。那些信息包涵发闯祸变的因素,事件的花色和其他一些一定的连带新闻。全数的浏览器都协理event
事件目的,不过各类浏览器的支撑艺术各不肖似。