JS事件传播流程以及事件阻止方法

什么是JavaScript事件?

所谓JS事件,即事件通常与函数配合使用,这样就可以通过发生的事件来驱动函数执行。js事件是由访问web页面的用户引起的一系列操作。当用户执行某些操作的时候,再去执行一系列代码,或者用来获取的详细信息。eg:鼠标位置,键盘按键。

DOM2级事件规定事件流包括三个阶段:事件捕获阶段、处于目标阶段、事件冒泡阶段

捕获阶段:先由文档的根节点document往事件触发对象,从外向内捕获事件对象;
目标阶段:到达目标事件位置(事发地),触发事件;
冒泡阶段:再从目标事件位置往文档的根节点方向回溯,从内向外冒泡事件对象。
在这里插入图片描述
注意
(1)、所有现代浏览器都支持事件冒泡,但在具体实现中略有差别。IE5.5及更早版本中事件冒泡会跳过元素(从body直接跳到document)。IE9、Firefox、Chrome、和Safari则将事件一直冒泡到window对象。
(2)、IE9、Firefox、Chrome、Opera、和Safari都支持事件捕获。尽管DOM标准要求事件应该从document对象开始传播,但这些浏览器都是从window对象开始捕获事件的。

                             如何阻止冒泡   

可以调用事件对象的stopPropagation()方法以阻止事件的继续传播。如果在同一对象上定义了其他处理程序,剩下的处理程序将依旧被调用,但调用stopPropagation()之后任何其他对象上的事件处理程序将不会被调用。

                            阻止浏览器默认行为

 事件默认行为:浏览器自己默认做的事情

 哪些默认行为要做阻止

  1.  a标签链接跳转

  2.  Submit按钮的提交,

 3.  右键菜单,

 4.文本框的输入

注意:

  • 阻止默认行为的方式

w3c的方法是event.preventDefault();

IE则是使用event.returnValue = false; return false;
          
自定义右键菜单 oncontextmenu

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值