事件類別：

tap：點(dian)擊事件；

longtap：長按事件(jian)；

touchstart：觸(chu)摸(mo)開始；

touchend：觸摸結束；

touchcansce：取消觸(chu)摸；

事件綁定：

bind綁(bang)定；

catch綁定；（能阻止事件冒泡）
mut-bind   互斥事件綁定
 

普通事件綁定

事(shi)件綁定的寫(xie)法類似于組件的屬性，如：

<view bindtap="handleTap">
    Click here!
</view>

如果用戶(hu)點擊這個 view ，則頁(ye)面的 handleTap 會被調用。

事件綁(bang)定(ding)函數可以(yi)是(shi)一個數據綁(bang)定(ding)，如：

<view bindtap="{{ handlerName }}">
    Click here!
</view>

此時(shi)，頁面的 this.data.handlerName 必須是一(yi)個字(zi)符串，指(zhi)定事件(jian)處理函(han)數名；如果它是個空(kong)字(zi)符串，則這(zhe)個綁定會失(shi)效（可以(yi)利用這(zhe)個特性來暫時(shi)禁(jin)用一(yi)些事件(jian)）。

自(zi)基礎(chu)庫(ku)版(ban)本(ben) 1.5.0 起(qi)，在大多數組(zu)件和自(zi)定義(yi)組(zu)件中， bind 后可以(yi)緊跟(gen)一個冒號，其含義(yi)不變，如 bind:tap 。基礎(chu)庫(ku)版(ban)本(ben) 2.8.1 起(qi)，在所有組(zu)件中開(kai)始提供這個支持。

綁定并阻止事件冒泡

除 bind 外，也可以用 catch 來(lai)綁定事(shi)件。與 bind 不同(tong)， catch 會阻止事(shi)件向上冒泡。

例如在(zai)下邊這個(ge)例子中，點(dian)(dian)(dian)擊 inner view 會先后調用handleTap3和(he)handleTap2(因(yin)為tap事件(jian)會冒泡到(dao) middle view，而 middle view 阻止(zhi)了(le) tap 事件(jian)冒泡，不再向父(fu)節點(dian)(dian)(dian)傳(chuan)遞)，點(dian)(dian)(dian)擊 middle view 會觸(chu)發handleTap2，點(dian)(dian)(dian)擊 outer view 會觸(chu)發handleTap1。

<view id="outer" bindtap="handleTap1">
  outer view
  <view id="middle" catchtap="handleTap2">
    middle view
    <view id="inner" bindtap="handleTap3">
      inner view
    </view>
  </view>
</view>

互斥事件綁定

自基礎(chu)庫版本 2.8.2 起，除(chu) bind 和 catch 外，還可以(yi)使用(yong) mut-bind 來綁定(ding)事件。一(yi)個(ge) mut-bind 觸發后，如果事件冒(mao)泡到其他(ta)節(jie)點上(shang)，其他(ta)節(jie)點上(shang)的 mut-bind 綁定(ding)函數(shu)不會被觸發，但(dan) bind 綁定(ding)函數(shu)和 catch 綁定(ding)函數(shu)依舊會被觸發。

換而言之，所有 mut-bind 是“互(hu)斥”的(de)，只會有其中一個綁定函(han)數被觸發。同(tong)時，它(ta)完(wan)全(quan)不影響(xiang) bind 和 catch 的(de)綁定效果(guo)。

例(li)如在下邊這個例(li)子中，點(dian)擊 inner view 會先后調用(yong) handleTap3 和(he) handleTap2 ，點(dian)擊 middle view 會調用(yong) handleTap2 和(he) handleTap1 。

<view id="outer" mut-bind:tap="handleTap1">
  outer view
  <view id="middle" bindtap="handleTap2">
    middle view
    <view id="inner" mut-bind:tap="handleTap3">
      inner view
    </view>
  </view>
</view>