讲述以下微信小程序中的冒泡事件和非冒泡

<!--事件 -->

< view id= 'outter' bindtap= "outterTap" >

outter

< view id= 'middle' bindtap= 'middleTap' >

middle

< view id= 'inner' bindtap= 'innerTap' >

inner

</ view >

</ view >

</ view >

test.js

innerTap : function (){

console .log ( 'inner事件' )

},

middleTap : function (){

console .log ( 'middleTap事件' )

},

outterTap : function (){

console .log ( 'outterTap事件' )

}

我们在js中把每个事件写下来看看都打印出什么inner-》middle-》outter

会发现当点击最里面的inner时，举个例子就和水泡一样从里到外进行执行 一次显示:inner事件、middleTap事件、outterTap事件，当点击middle时

会一次提示middleTap事件、inner事件。这就是典型的冒泡事件

我们如何在小程序中来阻止冒泡呢接下来我们在演示一下。这回我们在对应的id中增加一个catchtap属性进行阻止冒泡

< view id= 'outter' bindtap= "outterTap" >

outter

< view id= 'middle' catchtap= 'middleTap' >

middle

< view id= 'inner' catchtap= 'innerTap' >

inner

</ view >

</ view >

</ view >

这样我当我们对inner执行点击时，父级和爷爷不会触发。

当一个事件被触发后，他会向他父节点进行传递 这就是所谓的冒泡

当一个事件被触发后，他不会向他的父节点进行传递 这就是非冒泡/阻止冒泡