一、bindinput属性

bindinput是微信小程序中一个非常常用的属性，用于指定一个输入框输入时的事件处理函数。

<input bindinput="bindInputHandler">

在上面的代码中，当输入框发生输入事件时，会触发名为"bindInputHandler"的事件处理函数。举个例子：

<input bindinput="inputHandler">

Page({
  inputHandler:function(e){
    console.log(e.detail.value)
  }
})

在上面的代码中，当用户在一个input框输入时，inputHandler函数会被触发，这个函数可以在控制台中打印出用户输入的值。

二、bindinputblur

bindinputblur是在小程序中另一个非常实用的属性，用于指定输入框失去焦点时的事件处理函数。

<input bindinputblur="bindInputBlurHandler">

在上面的代码中，当输入框失去焦点时，会触发名为"bindInputBlurHandler"的事件处理函数。举个例子：

<input bindinputblur="blurHandler">

Page({
  blurHandler:function(e){
    console.log(e.detail.value)
  }
})

在上面的代码中，当用户在一个input框输入完成且失去焦点时，blurHandler函数会被触发，这个函数可以在控制台中打印出用户输入的值。

三、bindinput的用法

bindinput是在小程序中用于指定输入框输入时的事件处理函数的属性，使用如下所示：

<input bindinput="inputHandler">

当用户在input框内输入时，会触发名为inputHandler的处理函数：

Page({
  inputHandler:function(e){
    console.log(e.detail.value)
  }
})

在inputHandler函数内部，我们可以通过e.detail.value来获取用户输入框内的值：

Page({
  inputHandler:function(e){
    console.log(e.detail.value)
  }
})

四、bindinput中的值怎么调到页面

想要将用户输入的内容传递到页面上，可以通过数据绑定进行操作。首先定义一个data中的变量，如下所示：

Page({
  data:{
    inputValue:''
  },
  inputHandler:function(e){
    this.setData({
      inputValue: e.detail.value
    })
  }
})

在inputHandler函数中，通过this.setData()函数将当前输入框中的值赋给inputValue变量。接着，在wxml文件中可以通过双向绑定的方式将变量和输入框进行绑定：

<input bindinput="inputHandler" value="{{inputValue}}">

这样，无论用户在输入框中输入什么，都可以被赋值到变量inputValue当中，从而更新页面。

五、bindinput和bindtap

bindinput和bindtap是微信小程序中常用的两个属性之一。 bindtap用于处理点击事件，而bindinput用于处理输入框输入事件。举个例子：

<button bindtap="buttonTapHandler">按钮</button>
<input bindinput="inputHandler">

Page({
  buttonTapHandler:function(){
    console.log('按钮被点击了')
  },
  inputHandler:function(e){
    console.log('输入框的值为：'+e.detail.value)
  }
})

当用户点击按钮时，会触发buttonTapHandler函数；当用户在输入框中输入时，会触发inputHandler函数。

六、bindinput和bindsubmit

bindinput和bindsubmit都是在表单中很常用的属性之一。其中，bindinput用于监听用户在输入框中输入的事件；bindsubmit用于监听表单提交事件。举个例子：

<form bindsubmit="submitHandler">
  <input bindinput="inputHandler">
  <button form-type="submit">提交</button>
</form>

Page({
  inputHandler: function (e) {
    this.setData({
      inputValue: e.detail.value
    })
  },
  submitHandler: function (e) {
    console.log('表单已经提交')
    console.log('输入框的值为：'+this.data.inputValue)
  }
})

当用户在输入框中输入时，会触发inputHandler函数；当用户提交表单时，会触发submitHandler函数。

七、bindinput和bindblur的区别

bindinput和bindblur都是微信小程序中常用的属性之一，它们的区别是：

bindinput是在用户输入值时触发的事件，而bindblur是在输入框失去焦点时触发的事件。
bindinput的值会随着用户输入而实时更新，而bindblur的值只能在输入框失去焦点时才会更新。具体使用如下所示：

<input bindinput="inputHandler" bindblur="blurHandler">

Page({
  inputHandler:function(e){
    console.log('实时更新的值：'+e.detail.value)
  },
  blurHandler:function(e){
    console.log('输入框失去焦点时的值：'+e.detail.value)
  }
})

当用户在输入框中输入时，会实时打印出该输入框的值，而当用户失去焦点时，则会打印出此时的输入框的值。

bindinput详解