<style>div {padding: 50px;} #div1 {background: red;} #div2 {background: blue;} #div3 {background: green; position: absolute; top: 300px;}</style><script>window.onload = function() { var oDiv1 = document.getElementById('div1'); var oDiv2 = document.getElementById('div2'); var oDiv3 = document.getElementById('div3'); function fn1() { alert( this.id ); } oDiv1.addEventListener('click', function() { alert(1); }, false); oDiv1.addEventListener('click', function() { alert(3); }, true); oDiv3.addEventListener('click', function() { alert(2); }, false); // }</script></head><body> <div id="div1"> <div id="div2"> <div id="div3"></div> </div> </div></body></html>代码如上:当点击div2的时候是先弹出3,再弹出1的;但是直接点击div1的时候是先弹出1,再弹出3的。按照理解点击div1时应该和点击div2一样的弹出顺序啊?希望大神给予解答
1 回答
慕沐林林
TA贡献2016条经验 获得超9个赞
因为事件触发是先捕获再冒泡的,所以点击div2时候是先3再1,。
然后直接点击在元素上时,其实是相当于同时触发了捕获和冒泡,这个时候的顺序是根据你代码的绑定事件的先后顺序。
添加回答
举报
0/150
提交
取消