jqgrid 单元格绑定点击事件_微信小程序 事件系统

事件

什么是事件

• 事件是视图层到逻辑层的通讯方式。

• 事件可以将用户的行为反馈到逻辑层进行处理。

• 事件可以绑定在组件上，当达到触发事件，就会执行逻辑层中对应的事件处理函数。

• 事件对象可以携带额外信息，如 id, dataset, touches。

事件的使用方式

• 在组件中绑定一个事件处理函数。

如bindtap，当用户点击该组件的时候会在该页面对应的Page中找到相应的事件处理函数。

 Click me! 

• 在相应的Page定义中写上相应的事件处理函数，参数是event。

Page({
      tapName: function(event) {
        console.log(event)  }})

• 可以看到log出来的信息大致如下：

{
      "type":"tap",  "timeStamp":895,  "target": {
        "id": "tapTest",    "dataset":  {
          "hi":"WeChat"    }  },  "currentTarget":  {
        "id": "tapTest",    "dataset": {
          "hi":"WeChat"    }  },  "detail": {
        "x":53,    "y":14  },  "touches":[{
        "identifier":0,    "pageX":53,    "pageY":14,    "clientX":53,    "clientY":14  }],  "changedTouches":[{
        "identifier":0,    "pageX":53,    "pageY":14,    "clientX":53,    "clientY":14  }]}

使用WXS函数响应事件

基础库 2.4.4 开始支持，低版本需做 兼容处理 。

从基础库版本2.4.4开始，支持使用WXS函数绑定事件，WXS函数接受2个参数，第一个是event，在原有的event的基础上加了event.instance对象，第二个参数是ownerInstance，和event.instance一样是一个ComponentDescriptor对象。具体使用如下：

• 在组件中绑定和注册事件处理的WXS函数。

<wxs module="wxs" src="./test.wxs">wxs><view id="tapTest" data-hi="WeChat" bindtap="{
    {wxs.tapName}}"> Click me! view>

**注：绑定的WXS函数必须用{
    {}}括起来**

• test.wxs文件实现tapName函数

function tapName(event, ownerInstance) {
      console.log('tap wechat', JSON.stringify(event))}module.exports = {
      tapName: tapName}

ownerInstance包含了一些方法，可以设置组件的样式和class，具体包含的方法以及为什么要用WXS函数响应事件。

事件详解

事件分类

事件分为冒泡事件和非冒泡事件：

1. 冒泡事件：当一个组件上的事件被触发后，该事件会向父节点传递。

2. 非冒泡事件：当一个组件上的事件被触发后，该事件不会向父节点传递。

WXML的冒泡事件列表：

类型	触发条件	最低版本
touchstart	手指触摸动作开始
touchmove	手指触摸后移动
touchcancel	手指触摸动作被打断，如来电提醒，弹窗
touchend	手指触摸动作结束
tap	手指触摸后马上离开
longpress	手指触摸后ÿ