微信小程序之获取表单数据

作者: JONE 分类: PHPer 发布时间: 2020-03-01 18:20

原文链接:https://blog.csdn.net/candy_mi/article/details/80339142

注意点:

  • 1.所有的 input textarea button 全部包含在form表单元素里
  • 2.button 必须有 formType=”submit” 这个属性
  • 3.form 必须有提交事件 即 bindsubmit=”back_houtai”
  • 4.通过 name属性取值,name名称不可重复

wxml文件

<!--pages/biji/biji.wxml-->

<view class='index_seach'>

<form bindsubmit="back_houtai">
<view class='input_w professional'>
<text class='left'>总分</text>
<view class='input left'>
<input placeholder='请输入总分' cursor-spacing='20' name='total_score'></input>
</view>
</view>
<view class='input_w professional'>
<text class='left'>专业课分</text>
<view class='input left'>
<input placeholder='请输入初试专业课成绩' cursor-spacing='20' name='major_score'></input>
</view>
</view>

<view class='input_w professional'>
<text class='left'>入学年份</text>
<view class='input left'>
<input placeholder='请输入入学年份 格式:2018' cursor-spacing='20' name='enroll_date'></input>
</view>
</view>
<view class='textarea_w'>
<text class='left'>自我介绍</text>
<view class='textarea left'>
<textarea placeholder='请输入一段话来介绍一下自己,说不定会更加吸引学弟学妹哦~' cursor-spacing='20' name="self_intro"></textarea>
</view>
</view>
<button class='subClass_btn2' formType="submit">确定</button>
</form>
</view>

js文件,通过e.detial.value.name名获取表单元素值

// pages/biji/biji.js
Page({

/**
* 页面的初始数据
*/
data: {

},


//确认按钮把数据上传后台
back_houtai: function (e) {
var that = this;
var total_score = e.detail.value.total_score; //总分
var major_score = e.detail.value.major_score; //专业分
var enroll_date = e.detail.value.enroll_date; //年份
var self_intro = e.detail.value.self_intro; //个人介绍
console.log(total_score)
console.log(major_score)
console.log(enroll_date)
console.log(self_intro)

},

/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},

})