小程序--表单一次性获取值并提交

1、.wxml

<view>
<form bindsubmit="formSubmit" bindreset="formReset">
    <view class="container">
      <checkbox-group bindchange="checkboxChange" name="checkbox-group">
          <label class="checkbox" >
                  <checkbox value="checkbox1"/>checkbox1
          </label>
          <label class="checkbox" >
                  <checkbox value="checkbox2"/>checkbox1
          </label>
          <label class="checkbox" >
                  <checkbox value="checkbox3"/>checkbox1
          </label>
      </checkbox-group>
    </view>
    <view>
        <radio-group class="radio-group" name="radio-group">
          <label>
            <radio value="战士" checked="true"/>战士
          </label>
          <label>
            <radio value="法师" checked="true"/>法师
          </label>
          <label>
            <radio value="牧师" checked="true"/>牧师"
          </label>
        </radio-group>
    </view>
    <view>
      <view>input</view>
      <input name="input" placeholder='please input here'/>
    </view>
    <!--form表单内部添加button按钮实现相应事件 submit元素提交 reset元素重置-->
    <view class="btn-area">
          <button formType="submit">Submit</button>
          <button formType="reset">Reset</button>
    </view>
</form>
</view>

2、.js

Page({

formSubmit: function (e) {

console.log( 'form发生了submit事件，携带数据为：', e.detail.value)

},

formReset: function () {

console.log( 'form发生了reset事件')

}

})

3、输出结果

submit

form发生了submit事件，携带数据为： {checkbox-group: Array(2), radio-group: "牧师", input: "飒飒"}