E企盈营销工具技术服务商 热线:4006-838-530

小程序表单输入(新手)

E企盈直播平台营销卖货系统

表单填写提交是很常用的步骤;原理:1. 给所有的输入框,选择框添加同一个点击事件;2. 给每个输入框添加  data-key=’’  专属属性3. 输入框可直接获取输入的内容,将输入的内容赋值给空数组即可4. 特殊表单做特殊处理,具体步骤视情况而定;5. 编不下去了,看代码吧!– 表单 –view class=”iptWarp”  view class=”flex_y_center border”    view class=”ipt_key”真实姓名/view    input class=”flex_1″ placeholder=”请输入真实姓名” bindinput=”bindinput” value=”” data-key=”name”/input  /view  view class=”flex_y_center border”    view class=”ipt_key”电话号码/view    input class=”flex_1″ placeholder=”请输入您的联系方式” type=”number” bindinput=”bindinput” value=”” data-key=”tel”/input  /view  view class=”flex_y_center border”    view class=”ipt_key”微信号/view    input class=”flex_1″ placeholder=”请输入微信号” bindinput=”bindinput” value=”” data-key=”weChat”/input  /view  view class=”flex_y_center border”    view class=”ipt_key”性别/view    picker class=”flex_1″ mode=’selector’ bindchange=”bindinput”  data-key=”sex” value=”{{sexIndex}}” range=”{{sex}}”      view class=”c_gray” wx:if='{{sexHidden}}’请选择性别/view      view wx:else{{sex[sexIndex]}}/view    /picker  /view  view class=”flex_y_center border”    view class=”ipt_key”常驻地址/view    picker class=”flex_1″ mode=’region’ bindchange=”bindinput”  data-key=”city” value=”{{region}}”      view class=”c_gray ” wx:if='{{cityHidden}}’请选择城市/view      view wx:else{{region[0]}} – {{region[1]}} – {{region[2]}}/view    /picker  /view  view class=”flex_y_center border”    view class=”ipt_key”粉丝量/view    input class=”flex_1″ placeholder=”请输入您的粉丝量” type=”number” bindinput=”bindinput” value=”” data-key=”people”/input  /view  button hover-class=”none” class=”submit” catchtap=”submit”提交申请/button/viewjs:Page({  /**   * 页面的初始数据   */  data: {    sex:[‘男’,’女’],    sexIndex:0,    sexHidden: true,    cityHidden: true,    region:”,    ipt:{      name:”,      tel:”,      weChat:”,      sex:”,      city:”,      people:”    }  },  /**   * 生命周期函数–监听页面加载   */  onLoad: function (options) {  },  bindinput: function (e) {    let that = this    let sexIndex = that.data.sexIndex    let sexHidden = that.data.sexHidden    let region = that.data.region    let cityHidden = that.data.cityHidden    let ipt = that.data.ipt    let key_ = e.currentTarget.dataset.key    let value = e.detail.value    ipt[key_] = value    if (key_ == ‘sex’){      sexIndex = value      sexHidden = false    }    if (sexIndex == 0) {      ipt.sex = ‘男’    }else{      ipt.sex = ‘女’    }    if (key_ == ‘city’) {      region = value      cityHidden = false    }    // console.log(ipt)    that.setData({      sexIndex: sexIndex,      sexHidden: sexHidden,      region: region,      cityHidden: cityHidden    })  },  submit: function () {    let that = this    let ipt = that.data.ipt    if(ipt.name == ”){      wx.showToast({        title: ‘请输入姓名’,        icon:’none’      })    } else if (ipt.tel == ”){      wx.showToast({        title: ‘请输入电话号码’,        icon: ‘none’      })    } else if (ipt.weChat == ”) {      wx.showToast({        title: ‘请输入微信号’,        icon: ‘none’      })    } else if (ipt.sex == ”) {      wx.showToast({        title: ‘请选择性别’,        icon: ‘none’      })    } else if (ipt.city == ”) {      wx.showToast({        title: ‘请选择常驻地址’,        icon: ‘none’      })    } else if (ipt.people == ”) {      wx.showToast({        title: ‘请输入粉丝量’,        icon: ‘none’      })    } else {      // 此处提交数据      console.log(ipt)    }  }})

赞(0) 打赏
未经允许不得转载:E企盈小程序开发-热线:4006-838-530 » 小程序表单输入(新手)
分享到: 更多 (0)
E企盈小程序直播营销卖货系统
E企盈直播平台营销卖货系统

评论 抢沙发

E企盈小程序开发

联系我们联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏