绑定事件方法的第三个参数,就是控制事件触发顺序是否为事件捕获。true,事件捕获;false,事件冒泡。默认false,即事件冒泡。
<div id='id1'> <div id="id2"> <button id='id3'>id3 按钮</button> </div> </div>
var id1 = document.queryselector('#id1') var id2 = document.queryselector('#id2') var id3 = document.queryselector('#id3') // 事件冒泡 id1.addeventlistener('click', function(event){ console.log('click id1') }) id2.addeventlistener('click', function(event){ console.log('click id2') }) id3.addeventlistener('click', function(event){ console.log('click id3') // 取消冒泡事件 // event.cancelbubble = true }) // 点击id3输出 // click id3 // click id2 // click id1 // 事件捕获 id1.addeventlistener('click', function(event){ console.log('capture click id1') }, true) id2.addeventlistener('click', function(event){ console.log('capture click id2') }, true) id3.addeventlistener('click', function(event){ console.log('capture click id3') }, true) // 点击id3输出 // capture click id1 // capture click id2 // capture click id3
如对本文有疑问, 点击进行留言回复!!
asp.net中ajax和一般处理程序(handler.ashx)的交互
egg.js创建项目,目录介绍,简单使用,sequelize mysql使用
网友评论