你的位置:首页 > 软件开发 > Java > Event(事件)的传播与冒泡

Event(事件)的传播与冒泡

发布时间:2017-01-23 12:00:07
特性说明和原理图:标准浏览器和Ie9+浏览器都支持事件的冒泡和捕获,而IE8-浏览器只支持冒泡标准和Ie9+浏览器用stopPropagation()或cancelBubble阻止事件传播,而ie8-用e.cancelBubble属性来阻冒泡,注意ie9不支持cancelBubb ...

Event(事件)的传播与冒泡

特性说明和原理图:

Event(事件)的传播与冒泡

  • 标准浏览器和Ie9+浏览器都支持事件的冒泡和捕获,而IE8-浏览器只支持冒泡
  • 标准和Ie9+浏览器用stopPropagation()或cancelBubble阻止事件传播,而ie8-用e.cancelBubble属性来阻冒泡,注意ie9不支持cancelBubble属性(设置后不生效),但chrome、safari、opera、firefox都支持cancelBubble属性。
  • Ie8-用attachEvent为dom元素添加一个事件,但必须在事件名前加上on,此类事件只能在元素的冒泡阶段。
  • stopPropagatin()方法用于阻止事件的传播,如果设置在捕获阶段,则目标和冒泡阶段不会被执行;
  • cancelBubble属性只能阻止冒泡阶段,对捕获和目标阶段的事件不能阻止
  • preventDefault()和window.event.returnValue用于标准浏览器和ie9+,都可以阻止默认事件。ie8-可以用returnValue,preventDefault()。

示例代码(ie8-示例不提供)

html代码

<body class="body" >  <div class="log"></div> <input type="text" id="inTxt" name="intxt" /><div class="wrap"> <div class="cont">  <button type="button" class="button" id="btn">按钮</button>  <select name="stopType" id="stopType">    <option value="1">StopPropagation</option>    <option value="2">cancelBubble</option>  </select>  <button type="button" class="button" id="btnReject">cont阻止捕获或冒泡</button> </div></div></body>

原标题:Event(事件)的传播与冒泡

关键词:

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

可能感兴趣文章

我的浏览记录