獲取input有兩種方法：

第一：bindsubmit方法
注意：
1.使用form里面定義bindsubmit事件
2.bindsubmit事件需要配合button里面定義的formType=“submit” 操作
3.設(shè)置input的name值來獲取對應(yīng)的數(shù)據(jù)

<form bindsubmit="formSubmit">
	<input type="text" name="name" class="content" placeholder="請輸入司機姓名" />
	<input type="text" name="plateNo" class="content" placeholder="請輸入車牌號" />
	<button class="wehx-foot-btn" hover-class="wehx-button_hover" formType="submit">確定</button>
</form>

通過e.detail.value獲取數(shù)據(jù), 其中包含input的value值

formSubmit: function (e) {
    console.log(e.detail.value)
    let name= data.detail.value.name
    let plateNo= data.detail.value.plateNo;
}

第二種：bindinput方法
注意：
1.在input框內(nèi)使用bindinput屬性的方式定義事件名稱
2.事件是光標移動發(fā)生數(shù)據(jù)改變，數(shù)據(jù)自動獲取

<input type="text" bindinput='getInputName'  name="name" class="content" placeholder="請輸入司機姓名" />

通過e.detail獲取數(shù)據(jù)， 其中包含input的value值、光標的位置cursor

getInputName:function(e){
	console.log(e.detail)
	// 獲取到input的值
	let name = e.detail.value;
	// 獲取到光標的位置
	let local = e.detail.cursor;
}

參考：微信小程序之 獲取input框輸入值

form表單提交

<form bindsubmit="formSubmit" bindreset="formReset">
  <view class="section section_gap">
    <view class="section__title">是否公開信息</view>
    <switch name="isPub" />
  </view>
 
  <view class="section">
    <view class="section__title">手機號</view>
    <input name="phone" placeholder="手機號" />
  </view>
  <view class="section">
    <view class="section__title">密碼</view>
    <input name="pwd" placeholder="密碼" password/>
  </view>
  <view class="section section_gap">
    <view class="section__title">性別</view>
    <radio-group name="sex">
      <label>
        <radio value="男" checked/>男</label>
      <label>
        <radio value="女" />女</label>
    </radio-group>
  </view>
  <view class="btn-area">
    <button formType="submit">提交</button>
    <button formType="reset">重置</button>
  </view>
</form>
<view wx:if="{{isSubmit}}">
  {{warn ? warn : "是否公開信息："+isPub+"，手機號："+phone+"，密碼："+pwd+"，性別："+sex}}
</view>

.section{
  display: flex;
  flex-direction: row;
  margin: 20rpx;
}
.section view{
  margin-right: 20rpx;
}
.btn-area{
  margin: 20rpx;
}
button{
  margin: 10rpx 0;
}

let app = getApp();
Page({
  data: {
    isSubmit: false,
    warn: "",
    phone: "",
    pwd: "",
    isPub: false,
    sex: "男"
  },
  formSubmit: function (e) {
    console.log('form發(fā)生了submit事件，攜帶數(shù)據(jù)為：', e.detail.value);
    let { phone, pwd, isPub, sex } = e.detail.value;
    if (!phone || !pwd) {
      this.setData({
        warn: "手機號或密碼為空！",
        isSubmit: true
      })
      return;
    }
    this.setData({
      warn: "",
      isSubmit: true,
      phone,
      pwd,
      isPub,
      sex
    })
  },
  formReset: function () {
    console.log('form發(fā)生了reset事件')
  }
})

參考：微信小程序-form表單提交

注意幾個點：
實現(xiàn)過程分為以下幾步
1.給 form 表單設(shè)置 bindsubmit 屬性。
2.給所有 input / check等等項 設(shè)置 name 屬性 (否則無法獲取值)
3.給按鈕設(shè)置 form-type="submit”，與第一步 form 設(shè)置的 bindsubmit 屬性值 綁定
4.編寫按鈕觸發(fā)的函數(shù) (第一步與第三步共同綁定的）文章來源地址http://www.zghlxwxcb.cn/news/detail-674452.html

到了這里，關(guān)于微信小程序的form表單提交的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！