微信小程序——事件委托

事件委托

1. 什么是事件委托
将子元素的事件委托(绑定)给父元素
2. 事件委托的好处
1）. 减少绑定的次数
2）. 后期新添加的元素也可以享用之前委托的事件
3. 事件委托的原理
冒泡
4. 触发事件的是谁
子元素
5. 如何找到触发事件的对象
event.target
6. currentTarget VS target

currentTarget是绑定事件处理函数的元素， target是实际被鼠标点击得到的元素
1）. currentTarget要求绑定事件的元素一定是触发事件的元素
2）. target绑定事件的元素不一定是触发事件的元素，也可能是父元素

实例：

通过判断id确认currentTarget当前最新触发的是哪一个事件（phone or password）

当输入手机号码时，打印“phone”和值

当输入密码时，打印“password”和值

代码示例：

微信小程序——事件委托相关推荐

Android微信小程序原理,微信小程序事件流原理解析
这篇文章主要介绍了微信小程序事件流原理解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下一.什么是事件? 事件是视图层到逻辑层的通讯方式: 事件可 ...
微信小程序事件传参
微信小程序事件传参 wxml部分 js 部分 wxml部分 1.先绑定事件 2.在该元素上写上属性 data-index 3.参数值即为要传参数 <text catchtap="de ...
【微信小程序/事件】事件响应的各种场景
[微信小程序/事件]事件响应的各种场景 bindtap:点击事件 (1)使用范例 bindfocus:聚焦事件 (1)使用范例 bindblur:失焦事件 (1)使用范例 bindinput:输入事件 ...
微信小程序事件始末及相关资料整理
转载请注明来源:前端之巅微信公众号小道消息昨晚(9月21日晚)10:51,冯大辉在他的知名微信公众号小道消息上发了一篇7字标题的文章<微信应用号来了>,并加了"微信是一个操 ...
微信小程序----事件绑定
前言小程序中绑定事件, 通过bind关键字来实现.如: bindtap bindinput bindchanges等不同的组件支持不同的事件,具体查看组件的说明即可. 今天我们来了解bindtap和 ...
微信小程序事件和页面跳转
一.页面跳转 1.非TabBar页面一个小程序拥有多个页面,我们通过wx.navigateTo进入一个新的页面我们通过下边点击事件实现页面跳转进行代码实现及参考 wx.navigateBack() ...
微信小程序事件传参以及循环
微信的循环和传参 wx:for="{{ imageText }}" 循环体 wx:for-item="item" 指定微信的每一项 wx:for-index=& ...
微信小程序事件catchtap实现选项卡
关于事件参考:https://www.cnblogs.com/eline2018/p/10394974.html 1.什么是事件 (1) 事件是视图层到逻辑层的通讯方式. (2) 事件可以将用户的行为 ...
微信小程序事件点击后如何动态增删class类名（自用，没毛病）
问了度娘很久,感觉很多例子都用不到开发上,综合了三个小时.有了完整的方案第一种后台获取list集合,js中判断动态修改js 第二种手动定义list集合,js中判断动态修改js 流程后台返回了一 ...

微信小程序——事件委托

事件委托

微信小程序——事件委托相关推荐

最新文章

热门文章