• 小程序手机密码正则及引入icon


    <!--index.wxml-->
    <view class="wrap">
        <view class="bgimg">
          logo
        </view>
            <view class="userinfo">
                <view class="iconfont iconshouji" style="font-size:42rpx;color:gray"></view>
                <view> <input placeholder="请输入手机号" bindinput ="phone"></input> </view>
            </view>
            <view class="userinfo">
                <view class="iconfont iconsuo1" style="font-size:42rpx;color:gray"></view>
                <view> <input placeholder="请输入密码" type="password" bindinput ="password"></input> </view>
            </view>
            <view class="userinfobtn" bindtap="userinfobtn">登录</view>
    </view>
    //index.js
    //获取应用实例
    const app = getApp()
    Page({
      data: {
        phone:'',
        password:''
      },
      //手机号
      phone(e){
        this.setData({
          phone: e.detail.value
        })
      },
      //密码
      password(e){
        this.setData({
          password: e.detail.value
        })
      },
    
      userinfobtn(){
        var phone = this.data.phone;
        var password = this.data.password;
        if (phone == '') {
          wx.showToast({
            title: '手机号不能为空',
            icon: 'none',
            duration: 1500
          })
          
          return false
        } 
        else if (phone.length != 11) {
          wx.showToast({
            title: '手机号长度有误!',
            icon: 'none',
            duration: 1500
          })
          return false;
        }else if (password == '') {
          wx.showToast({
            title: '请输入密码!',
            icon: 'none',
            duration: 1500
          })
          return false
        } 
        else if (password.length < 6) {
          wx.showToast({
            title: '密码长度需在6-18之间!',
            icon: 'none',
            duration: 1500
          })
          return false;
        }
        //let str = /^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(.[a-zA-Z0-9-]+)*.[a-zA-Z0-9]{2,6}$/ //邮箱正则
        //let str = /(^d{15}$)|(^d{18}$)|(^d{17}(d|X|x)$)/ //身份证号正则
        //let str = /^[A-Za-z0-9]+w{7}$/ //验证密码正则
        //  以字母开头,长度在6-18之间,只能包含字符、数字和下划线
        var reg = /^[a-zA-Z]w{5,17}$/;
        if (!reg.test(password)) {
          wx.showToast({
            title: '密码需以字母开头,包含字符、数字和下划线!',
            icon: 'none',
            duration: 2200
          })
          return false;
        }else{
          this.setData({
            password:password
          })
          console.log('手机号:'+password)
        }
        //手机号正则
        var myreg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1})|(17[0-9]{1}))+d{8})$/;
        if (!myreg.test(phone)) {
          wx.showToast({
            title: '手机号有误!',
            icon: 'none',
            duration: 1500
          })
          return false;
        }else{
          this.setData({
            phone:phone,
          })
          wx.setStorageSync('phone', phone)//同步数据存储
          console.log('密码:'+phone)
        }
        return true;
      }
    })
    //css
    .userinfobtn{
       86vw;
      height: 80rpx;
      line-height: 80rpx;
      margin-left: 7vw;
      margin-top: 50rpx;
      text-align: center;
      border-radius: 40rpx;
      color: white;
      letter-spacing: 7rpx;
      font-size: 32rpx;
      background-color:  rgb(51, 138, 238); /* 不支持线性的时候显示 */
      background-image: linear-gradient(to right, rgb(85, 198, 226), #6495ed);
      box-shadow: 10rpx 10rpx 10rpx rgba(141, 161, 167, 0.9);
    }

    引入icon

    然后再app.wxss中@import "/icon/icon.wxss";即可

  • 相关阅读:
    在Android Studio中用Gradle添加Robolectric
    Windows环境下利用github快速配置git环境
    上传Android代码到Jcenter(解决了字符映射的问题)
    RecyclerView和ScrollView嵌套使用
    Android Java类编写规范+优化建议
    3.0之后在LinearLayout里增加分割线
    【转】Android Studio中通过快捷键来提取提取方法
    为什么Android应该根据屏幕分辨率来加载不同的图片文件
    JSON/XML格式化插件比较
    利用在线工具根据JSon数据自动生成对应的Java实体类
  • 原文地址:https://www.cnblogs.com/minghan/p/13253119.html
Copyright © 2020-2023  润新知