原文链接:https://www.cnblogs.com/lhm166/articles/9947383.html
事件冒泡就是指嵌套事件发生,如果多层标签嵌套, 里层事件发生后, 其外层会相应发生, 如:
<view bindtap=‘handout‘> outer <view bindtap=‘handmiddle‘> middle <view bindtap=‘handinner‘>inner</view> </view> </view>
handout: function () { console.log("out"); }, handmiddle: function () { console.log("middle"); }, handinner: function () { console.log("inner"); }
点击inner三个事件都执行, 点击middlek执行handmiddle和handout, 点击out只执行handout
阻止事件冒泡行为: 将bindtap改为catchtap就行了。
catchtap只会触发自身的点击事件,会阻断自身的冒泡行为,可以理解为,不管是不是自身触发的点击行为, 传到我这里, 我就将它阻断(不再向上传递)。如:
<view bindtap=‘handout‘> outer <view catchtap=‘handmiddle‘> middle <view bindtap=‘handinner‘>inner</view> </view> </view>
点击inner, 执行的是handinner和handmiddle两个函数,因为midd的catchtap阻止了事件冒泡行为,所以outer不会执行