点击事件:tap
长按事件:longtap
触摸事件:touchstart; touchend;touchcancel;touchmove
其他:input;submit....
前三类是冒泡事件,其他的称为非冒泡事件
wxml代码
<!--index.wxml-->
<!-- <view class='view1' bindtap='cli1'>111
<view class='view2' bindtap='cli2'>222
<view class='view3' bindtap='cli3'>333</view>
</view>
</view> -->
<view class='view1' catchtap='cli1'>111
<view class='view2' catchtap='cli2'>222
<view class='view3' catchtap='cli3'>333</view>
</view>
</view>
wxss代码
.view1{
width: 500px;
height: 500px;
background: green;
}
.view2{
width: 300px;
height: 300px;
background: red;
}
.view3{
width: 100px;
height: 100px;
background: blue;
}
wxjs代码
//事件处理函数
cli1:function(){
console.log('view1')
},
cli2: function () {
console.log('view2')
},
cli3: function () {
console.log('view3')
},
冒泡事件的机制是点击最里层的三个盒子 先打印view3 依次是view2 view1,点击第二层盒子打印view2 view1
阻止冒泡事件的发生,直接把bindtap改为catchtap。点击不触发父盒子元素