用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索
  • TA的每日心情
    慵懒
    2017-1-6 10:46
  • 签到天数: 2 天

    [LV.1]初来乍到

    173

    主题

    181

    帖子

    981

    金钱

    咫尺尊享

    Rank: 5Rank: 5

    积分
    0
    2017-3-3 14:03:28 柿霖不是林 咫尺尊享 楼主 41854
    demo功能比较简单:填写手机号及姓名后跳转到成功页面

    其中手机号,使用了正则验证








    [HTML] 纯文本查看 复制代码
    //index.js
    //获取应用实例
    var app = getApp()
    Page({
      data: {
        windowHeight: 0,
     
        motto: 'Hello World',
        userInfo: {},
     
        bodyShow: false,
         
        portUrl: 'https://tech11.cn/a/taiji/user/AccountOpen',
        portType: 8,
     
        bgImg: '../../image/bgImg.jpg',
        bgInput: '../../image/bgInput.png',
        bgSubmit: '../../image/btnSubmit.png',
        imgTitle: '../../image/title.png',
        imgBottomText: '../../image/bottomText.png',
        imgT9Logo: '../../image/iconLogo.png',
     
        phoneNumberInit: '',
        userNameInit: '',
        phoneNumber: '',
        userName: '',
        sendLoading: false,
        toastShow: false,
        toastMask: false,
        toastIcon: '',
        toastTitle: '提示语',
        toastTemp: null
      },
      onShow () {
        this.setData({
          phoneNumberInit: '',
          userNameInit: ''
        })
      },
      //事件处理函数
      bindViewTap () {
        wx.navigateTo({
          url: '../logs/logs'
        })
      },
      //校验
      validate () {
        var that = this;
        var phone = that.data.phoneNumber;
        var userName = that.data.userName;
         
        //是否在提交中
        // if(that.data.sendLoading) return false;
         
        //去除两边空格
        var trim = function(str) {
          return str.replace(/(^\s*)|(\s*$)/g, ""); 
        };
     
        if(trim(phone).length == 0) {
          that.showToast({
            icon: 'phone',
            title: '请输入正确的手机号'
          })
          return false;
        }
     
        var reg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/;
        if(!reg.test(trim(phone))) {
          that.showToast({
            icon: 'phone',
            title: '请输入正确的手机号'
          })
          return false;
        }
     
        if(trim(userName).length == 0) {
          that.showToast({
            icon: 'user',
            title: '请输入姓名'
          })
          return false;
        }
        return true;
      },
      // 显示提示框
      showToast (opts) {
        var that = this;
        var title = opts.title || '';
        var icon = opts.icon || '';
        var mask = opts.mask || false;
        var duration = opts.duration || 3000;
        that.setData({
          toastShow: true,
          toastTitle: title,
          toastMask: mask,
          toastIcon: icon
        })
        if(duration == 'along') return;
        clearTimeout(that.data.toastTemp);
        that.setData({
          toastTemp: setTimeout(function() {
            that.setData({
              toastShow: false,
              toastMask: false
            })
          }, duration)
        })
      },
      // 隐藏提示框
      hideToast (opts) {
        this.setData({
          toastShow: false,
          toastTitle: '',
          toastIcon: '',
          duration: '',
          toastMask: false
        })
      },
      // 监听手机号
      bindPhoneNumber (e) {
        this.data.phoneNumber = e.detail.value;
      },
      //
      bindUserName (e) {
        this.data.userName = e.detail.value;
      },
      //提交
      onSubmit () {
        // console.log('submit')
        // console.log(encodeURIComponent(JSON.stringify(this.data.userInfo)))
        // console.log(JSON.stringify(this.data.userInfo));
        // return false;
     
        var that = this;
        if(!that.validate()) return;
     
        that.showToast({
          title: '提交中...',
          icon: 'loading',
          mask: true,
          duration: 'along'
        })
        that.sendRequest();
      },
      // 提交
      sendRequest () {
        var that = this;
        var phone = this.data.phoneNumber;
        var userName = this.data.userName;
        // phone = '13430614810';
        // userName = 'hetianhe';
        // console.log(phone, userName);
         
        var sucCallback = function() {
          that.hideToast();
          wx.navigateTo({
            url: '../result/result'
          })
        };
        var hasOpenCallback = function(msg) {
          that.hideToast();
          that.showToast({
            title: msg,
            icon: 'tips',
            duration: 4000
          })
        };
        var errCallback = function(msg) {
          that.hideToast();
          that.showToast({
            title: msg,
            icon: 'tips',
            duration: 4000
          })
        };
     
        // var randomResult = function() {
        //   // var randomNum = Math.floor(Math.random()*(3)) + 1;
        //   var randomNum = that.data.userName;
        //   randomNum = 1;
        //   if(randomNum == 1) {
        //     sucCallback();
        //   } else if(randomNum == 2) {
        //     hasOpenCallback('hasOpenCallback');
        //   } else if(randomNum == 3) {
        //     errCallback('error');
        //   }
        // };
        // setTimeout(function() {
        //   randomResult();
        // }, 4000);
        // return false;
     
        wx.request({
          url: that.data.portUrl,
          data: {
            type: that.data.portType,
            phone: phone,
            name: userName,
            tssign: (new Date()).getTime(),
            appInfo: 'cow_xcx',
            note: encodeURIComponent(JSON.stringify(this.data.userInfo))
          },
          header: {
              'content-type': 'application/json'
          },
          success: function(res) {
            var data = res.data.data;
            var code = data.code;
            var message = data.message;
            console.log(data);
            // code:0  message:预约成功
            // code:-1 message:该手机号已经预约
            if(code == 0) {
              sucCallback();
            } else if(code == -1) {
              hasOpenCallback(message);
            } else {
              errCallback(message);
            }
          }
        })
      },
      onLoad () {
        // console.log('onLoad')
        var that = this
        //调用应用实例的方法获取全局数据
        app.getUserInfo(function(userInfo){
          //更新数据
          that.setData({
            userInfo:userInfo
          })
          // console.log(that.data.userInfo)
        })
        that.setData({
          windowHeight: app.globalData.systemInfo.windowHeight
        });
      },
      onReady () {
        var that = this;
        that.setData({
          bodyShow: true
        })
      },
      // 定义分享
      onShareAppMessage () {
        return {
          title: '泰九智投产品预约',
          desc: '泰九智能投顾产品热销中,欢迎预约购买!',
          path: '/pages/index/index'
        }
      }
    })





    游客,如果您要查看本帖隐藏内容请回复

    本帖子中包含更多资源

    您需要 登录 才可以下载或查看,没有帐号?立即注册

    x
    使用道具 举报 回复
    学习一下  看看能不能用上
    确实是难得好帖啊,顶先
    观摩学习,新手上路
    我有流量,你有产品,我们就可以合作,有意的个人开发者朋友可以联系微,信,号j i m 2 0 1 8 0 6 8 8,详聊
    发新帖
    您需要登录后才可以回帖 登录 | 立即注册
    咫尺论坛|小程序开发社区
    X

    扫码添加专属客服即可随时咨询

    还可领取小程序推广攻略