查看“小程序:事件类型和事件对象”的源代码
←
小程序:事件类型和事件对象
跳转至:
导航
,
搜索
因为以下原因,您没有权限编辑本页:
您所请求的操作仅限于该用户组的用户使用:
用户
您可以查看与复制此页面的源代码。
前边说到触发事件是由“用户在渲染层的行为反馈”以及“组件的部分状态反馈”引起的,由于不同组件的状态不一致,所以我们这里不讨论组件相关的事件(组件的事件可以参考其参数说明,详情见官方文档 https://mp.weixin.qq.com/debug/wxadoc/dev/component/ ) 常见的事件类型如表3-10所示。 表3-10 常见的事件类型 <nowiki>类型 触发条件 touchstart 手指触摸动作开始 touchmove 手指触摸后移动 touchcancel 手指触摸动作被打断,如来电提醒,弹窗 touchend 手指触摸动作结束 tap 手指触摸后马上离开 longpress 手指触摸后,超过350ms再离开,如果指定了事件回调函数并触发了这个事件,tap事件将不被触发 longtap 手指触摸后,超过350ms再离开(推荐使用longpress事件代替) transitionend 会在 WXSS transition 或 wx.createAnimation 动画结束后触发 animationstart 会在一个 WXSS animation 动画开始时触发 animationiteration 会在一个 WXSS animation 一次迭代结束时触发 animationend 会在一个 WXSS animation 动画完成时触发</nowiki> 当事件回调触发的时候,会收到一个事件对象,对象的详细属性如下表所示。 表3-11 事件对象属性 <nowiki>属性 类型 说明 type String 事件类型 timeStamp Integer 页面打开到触发事件所经过的毫秒数 target Object 触发事件的组件的一些属性值集合 currentTarget Object 当前组件的一些属性值集合 detail Object 额外的信息 touches Array 触摸事件,当前停留在屏幕中的触摸点信息的数组 changedTouches Array 触摸事件,当前变化的触摸点信息的数组</nowiki> 这里需要注意的是target和currentTarget的区别,currentTarget为当前事件所绑定的组件,而target则是触发该事件的源头组件。 代码清单3-19 事件对象示例 <nowiki><!-- page.wxml --> <view id="outer" catchtap="handleTap"> <view id="inner">点击我</view> </view> // page.js Page({ handleTap: function(evt) { // 当点击inner节点时 // evt.target 是inner view组件 // evt.currentTarget 是绑定了handleTap的outer view组件 // evt.type == “tap” // evt.timeStamp == 1542 // evt.detail == {x: 270, y: 63} // evt.touches == [{identifier: 0, pageX: 270, pageY: 63, clientX: 270, clientY: 63}] // evt.changedTouches == [{identifier: 0, pageX: 270, pageY: 63, clientX: 270, clientY: 63}] } })</nowiki> 关于target和currentTarget对象的详细参数如表3-12所示。 表3-12 target和currentTarget事件对象属性 <nowiki>属性 类型 说明 id String 当前组件的id tagName String 当前组件的类型 dataset Object 当前组件上由data-开头的自定义属性组成的集合</nowiki> 关于touch和changedTouches对象的详细参数如表3-13所示。 表3-13 touch和changedTouches对象属性 <nowiki>属性 类型 说明 identifier Number 触摸点的标识符 pageX, pageY Number 距离文档左上角的距离,文档的左上角为原点 ,横向为X轴,纵向为Y轴 clientX, clientY Number 距离页面可显示区域(屏幕除去导航条)左上角距离,横向为X轴,纵向为Y轴</nowiki>
返回至
小程序:事件类型和事件对象
。
导航菜单
个人工具
登录
命名空间
页面
讨论
变种
视图
阅读
查看源代码
查看历史
更多
搜索
导航
首页
最近更改
随机页面
帮助
工具
链入页面
相关更改
特殊页面
页面信息