微信小程式監聽input輸入並取值

小程式的事件分為兩種，冒泡和非冒泡事件，像<form/>的submit事件，<input/>的input事件，<scroll-view/>的scroll事件等非冒泡事件，需要到元件的文件裡去找，如下是我截圖的一些常用的非冒泡事件

非冒泡事件：當一個元件上的事件被觸發後，該事件不會向父節點傳遞。

想要實時監聽input的輸入只要使用bindinput就可以了，

wxml：

  <input bindinput='watchPassWord' type='password' class="weui-input" placeholder="請輸入密碼" />

js：

Page({
  // 監聽輸入
  watchPassWord: function (event) {
    console.log(event.detail.value);
  }
})

event是當前的事件物件，包含當前的各種資訊，detail就是我們需要的資訊了，按自己的需求處理就好，console展開如下：

 

冒泡事件：當一個元件上的事件被觸發後，該事件會向父節點傳遞。