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

小程序表单认证布局及验证

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

tset.wxmlview class=’form’view class=’content’  view class=’left’姓名:/view  view class=’right’    view class=’right-left’     input placeholder=’请输入真实姓名’ bindinput=’getNameValue’ value='{{name}}’ /    /view      /view/viewview class=’content’  view class=’left’手机号:/view  view class=’right’    view class=’right-left’   input placeholder=’请输入手机号’ bindinput=’getPhoneValue’ value='{{phone}}’ /    /view   /view/viewview class=’content’  view class=’left’验证码:/view  view class=’right’    view class=’right-left’  input placeholder=’请输入验证码’ bindinput=’getCodeValue’ value='{{code}}’ /    /view    view class=’right-right’      button class=’btn’验证码/button    /view  /view/view!–  wx:if 和wx:else要紧紧在一起 —  view wx:if='{{upimg}}’ class=’upimage’    image class=’upimg’ src='{{upimg}}’/image  /view  view wx:else    view class=”upimage” catchtap=’uploadimgurl’      view class=’upimage-tips’        image class=”add” src=”/static/images/index/upimg.png” /image      /view      view class=’upimage-tips’        text点击上传营业执照/text      /view    /view  /view  button class=’changeBtn’ bindtap=’save’提交认证资料/button/viewtest.wxsspage {  width: 100%;  height: 100%;}.content {  width: 95%;  height: 80rpx;  margin: 0 auto;  border-bottom: 1rpx solid gray;  margin-top: 5%; }.left {  width: 20%;  height: 80rpx;  float: left;  text-align: left;  line-height: 80rpx;  font-size: 30rpx;}.right {  width: 80%;  height: 80rpx;    float: right;  text-align: left;  line-height: 80rpx;}.right-left input {  float: left;  text-align: left;  height: 80rpx;}.right-right {  width: 30%;  float: right;  height: 80rpx;}.btn {  height: 80rpx;  font-size: 28rpx;border: 1rpx solid greenyellow;}.upimage {  background-color: #f2f2f2;  border: 1rpx solid #ccc;  width: 80%;  /* margin-top: 10%; */  height: 300rpx;  border-radius: 10rpx;  margin: 50rpx auto;}.upimg {  width: 100%;  height: 300rpx;}.upimage-tips {  height: 80rpx;  line-height: 80px;  text-align: center;  margin: 50rpx auto;}.upimage-tips text {  font-size: 30rpx;  color: darkgray;}.add {  width: 80rpx;  height: 80rpx;  align-items: center;  /* position: fixed; */  margin: 0 auto;  line-height: 80px;  text-align: center;}.changeBtn {  width: 100%;  align-items: center;  background: #1eb31c;  color: #fff;  position: fixed;  bottom: 0;  line-height: 100rpx;  left: 0;}验证必填信息不能为空test.js//logs.jsPage({  /**  * 页面的初始数据  */  data: {    name: ”,//姓名    phone: ”,//手机号    code: ”,//验证码    iscode: null,//用于存放验证码接口里获取到的code    upimg: “”,    codename: “获取验证码”,  },  //获取input输入框的值  getNameValue: function (e) {    this.setData({      name: e.detail.value    })  },  getPhoneValue: function (e) {    this.setData({      phone: e.detail.value    })  },  getCodeValue: function (e) {    this.setData({      code: e.detail.value    })  },  getCode: function () {    var a = this.data.phone;    var _this = this;    var myreg = /^(14[0-9]|13[0-9]|15[0-9]|17[0-9]|18[0-9])d{8}$$/;    if (this.data.phone == “”) {      wx.showToast({        title: ‘手机号不能为空’,        icon: ‘none’,        duration: 1000      })      return false;    } else if (!myreg.test(this.data.phone)) {      wx.showToast({        title: ‘请输入正确的手机号’,        icon: ‘none’,        duration: 1000      })      return false;    } else {      wx.request({        data: {},        ‘url’: 接口地址,        success(res) {          console.log(res.data.data)          _this.setData({            iscode: res.data.data          })          var num = 61;          var timer = setInterval(function () {            num–;            if (num = 0) {              clearInterval(timer);              _this.setData({                codename: ‘重新发送’,                disabled: false              })            } else {              _this.setData({                codename: num + “s”              })            }          }, 1000)        }      })    }  },  //获取验证码  getVerificationCode() {    this.getCode();    var _this = this    _this.setData({      disabled: true    })  },  //提交表单信息  save: function () {    var myreg = /^(14[0-9]|13[0-9]|15[0-9]|17[0-9]|18[0-9])d{8}$$/;    if (this.data.name == “”) {      wx.showToast({        title: ‘姓名不能为空’,        icon: ‘none’,        duration: 1000      })      return false;    }    if (this.data.phone == “”) {      wx.showToast({        title: ‘手机号不能为空’,        icon: ‘none’,        duration: 1000      })      return false;    } else if (!myreg.test(this.data.phone)) {      wx.showToast({        title: ‘请输入正确的手机号’,        icon: ‘none’,        duration: 1000      })      return false;    }    if (this.data.code == “”) {      wx.showToast({        title: ‘验证码不能为空’,        icon: ‘none’,        duration: 1000      })      return false;    } else if (this.data.code != this.data.iscode) {      wx.showToast({        title: ‘验证码错误’,        icon: ‘none’,        duration: 1000      })      return false;    } else {      wx.setStorageSync(‘name’, this.data.name);      wx.setStorageSync(‘phone’, this.data.phone);      wx.redirectTo({        url: ‘../add/add’,      })    }    if (this.data.upimg == “”) {      wx.showToast({        title: ‘营业执照不能为空’,        icon: ‘none’,        duration: 1000      })      return false;    }  },  //上传照片  uploadimgurl: function () {    var that = this;    var upimg = that.data.upimg;    //选择照片    wx.chooseImage({      success(res) {        var tempFilePaths = res.tempFilePaths        that.setData({          upimg: tempFilePaths,        })      }    })  },  /**  * 生命周期函数–监听页面加载  */  onLoad: function (options) {  },})

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

评论 抢沙发

E企盈小程序开发

联系我们联系我们

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

支付宝扫一扫打赏

微信扫一扫打赏