美文网首页
微信小程序点击事件冒泡

微信小程序点击事件冒泡

作者: _littleTank_ | 来源:发表于2017-11-02 15:17 被阅读0次

微信小程序事件冒泡:

<view  bindtap='bindtap2'>
     <view  bindtap='bindtap1'>
            事件冒泡
     </view>
</view>
bindtap1:function(event){
  console.log(“111111”)
},
bindtap2:function(event){
  console.log(“2222”)
}

如上代码:如果点击了bindtap1事件会执行:bindtap1和bindtap2,也就是会打印出“111111”和“2222”,这个就是冒泡,如何解决呢?
小程序的事件主要有:

touchtab 点击事件

touchstart 开始滑动

touchmove 滑动中

touchend 滑动结束

touchcancel 滑动中断 一般来电或其他弹出框使得滑动中断

小程序中的wxml中绑定事件有两种:以touchtab为例 ,在wxml中必须有bind/catch不然无法实现上述事件
bind的不会阻止事件冒泡(元素最里层到最外层函数执行),catch会阻止冒泡,只是冒泡到当前层结束 。

所以想要阻止事件冒泡那么可以八bindtap事件改成catchtap就ok 了。

相关文章

  • 微信小程序点击事件冒泡

    微信小程序事件冒泡: 如上代码:如果点击了bindtap1事件会执行:bindtap1和bindtap2,也就是会...

  • 微信小程序 事件响应

    返回目录 微信小程序中事件分为冒泡事件和非冒泡事件: 冒泡事件:当一个组件上的事件被触发后,该事件会向父节点传递。...

  • 小程序的捕获、冒泡事件

    小程序的捕获、冒泡事件一、冒泡事件 bindtap点击哪个事件,会触发自己和包裹自己的所有事件二、取消冒泡事件 c...

  • 点击事件传参

    1.小程序点击事件 1.bindtap,catchtap(防冒泡)

  • 微信小程序

    微信小程序 - 监听 TabBar 切换点击事件 在小程序开发的时候想要监听系统的 TabBar 切换点击事件,只...

  • 小程序bind事件和catch事件区别

    在小程序中事件分为冒泡事件和非冒泡事件。 本文以冒泡事件tap(手指触摸后马上离开,也就是点击事件)为例子来区别b...

  • 微信小程序绑定事件解析

    小程序点击事件有两种bindtap和catchtap,前者不会阻止冒泡事件向上冒泡,后者则可以阻止向上冒泡。 1....

  • 微信小程序--点击事件

    1.点击事件bindtap 绑定事件 :所有层都可触发catchtap 绑定事件: 只有最顶层可触发2.事件eve...

  • 微信小程序事件应用详解

    一、微信小程序——事件 1、冒泡事件:当一个组件上的事件被触发后,该事件会向父节点传递。 bindtap事件( 当...

  • 微信小程序 阻止事件冒泡

    在小程序开发中也存在着事件冒泡的情况,有时候很影响我们的代码逻辑,然而处理事件冒泡也很简单,我们只需要把子控件的b...

网友评论

      本文标题:微信小程序点击事件冒泡

      本文链接:https://www.haomeiwen.com/subject/leoopxtx.html