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

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

浏览量:467 时间: 来源:面壁思过程

前言:微信小程序中很多地方运用到了表单,很多时候我们需要把表单中的内容提取出来返回给后台,这里我随便写了一点

注意点:

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>
wxss文件/* pages/biji/biji.wxss */
page{font-size: 30rpx;}.left{ float: left}.right{float: right}.index_seach {width: 100%;margin-top: 20rpx;height: auto;margin-bottom: 30rpx;}/* 表单类通用 表单类通用 表单类通用*/.input_w {width: 100%;height: 90rpx;line-height: 90rpx;/* background: lightblue; */}
.input_w text {display: block;width: 20%;text-align: center;/* background: red; */}
.input_w .input {width: 75%;height: 70rpx;margin-top: 10rpx;border: 1px solid #ccc;box-sizing: border-box;}
.input input {margin-top: 10rpx;margin-left: 10rpx;/* background: lightblue; */}

.textarea_w {display: block;width: 100%;height: 180rpx;overflow: hidden;}
.textarea_w text {display: block;width: 20%;text-align: center;line-height: 90rpx;}
.textarea {width: 75%;height: 140rpx;margin-top: 10rpx;border: 1px solid #ccc;padding: 8rpx;/* background: lightblue; */overflow: hidden;}
.textarea textarea {width: 100%;height: 130rpx;/* background: lightcoral; */}
/* 表单类通用 表单类通用 表单类通用*/


.subClass_btn2 {margin-top: 40rpx;width: 80%;height: 80rpx;line-height: 80rpx;font-size: 30rpx;color: #fff;bac

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

产品经理

手机 : 13312967497

擅长 : 小程序流量变现

扫码领取礼包

热门模板

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎