密码框禁止粘贴

2021-10-28 11:08:01 +08:00
parent a9e0bf7aa2
commit 06d58bbdf3
8 changed files with 342 additions and 17 deletions
@@ -13,6 +13,8 @@ Page({
    showGetCaptcha: true,
    show: true, // 默认显示的是闭眼睛
    showVerify: true,
+    vals:[],
+    valsVerify: []
  },

  bindInputPhone(e) {
@@ -84,7 +86,86 @@ Page({
    }, 1000)
    // 倒计时 end
  },
-
+  clearrepeatval(){
+    this.data.vals = []
+    wx.showToast({
+      title: '禁止复制粘贴请手动输入',
+      icon: 'none',
+      duration: 2000
+    })
+    this.setData({
+      password: ''
+    })
+    return
+  },
+  clearrepeatvalVerify(){
+    this.data.valsVerify = []
+    wx.showToast({
+      title: '禁止复制粘贴请手动输入',
+      icon: 'none',
+      duration: 2000
+    })
+    this.setData({
+      verifyPassword: ''
+    })
+    return
+  },
+  // 新密码的输入
+  handlePasswordInput(e) { //禁止输入中复制粘贴
+    // 获取当前数组
+    const vals = this.data.vals
+    // 获取当前输入的值
+    const currentval = e.detail.value.replace(/\s+/g, "")
+    if(currentval){ // 如果值存在追加到vals中
+      vals.push(currentval)
+    }
+    if(vals.length == 1 ){ 
+      const v = vals[vals.length-1].length
+      if(v > 1){ // 如果第一个的长度就大于1 说明是粘贴过来的
+        this.clearrepeatval()
+      }
+    }
+    if(vals.length > 1){ 
+      // 如果值数组大于1 就获取最后一个值长度和倒数第二个值长度 
+      // 比较值长度差如果大于1 则粘贴的
+      const lastv = vals[vals.length-1].length // 获取最后一个值的长度
+      const secondv = vals[vals.length-2].length // 获取倒数第二个值得长度
+      const dis = lastv - secondv
+      if(dis>1){
+        this.clearrepeatval()
+      }
+    }
+    // 最后赋值
+    this.data['password'] = currentval
+  },
+  // 确认新密码的输入
+  handleVerifyPasswordInput(e) { //禁止输入中复制粘贴
+    // 获取当前数组
+    const vals = this.data.valsVerify
+    // 获取当前输入的值
+    const currentval = e.detail.value.replace(/\s+/g, "")
+    if(currentval){ // 如果值存在追加到vals中
+      vals.push(currentval)
+    }
+    if(vals.length == 1 ){ 
+      const v = vals[vals.length-1].length
+      if(v > 1){ // 如果第一个的长度就大于1 说明是粘贴过来的
+        this.clearrepeatvalVerify()
+      }
+    }
+    if(vals.length > 1){ 
+      // 如果值数组大于1 就获取最后一个值长度和倒数第二个值长度 
+      // 比较值长度差如果大于1 则粘贴的
+      const lastv = vals[vals.length-1].length // 获取最后一个值的长度
+      const secondv = vals[vals.length-2].length // 获取倒数第二个值得长度
+      const dis = lastv - secondv
+      if(dis>1){
+        this.clearrepeatvalVerify()
+      }
+    }
+    // 最后赋值
+    this.data['verifyPassword'] = currentval
+  },
  // 确认
  formSubmit(e) {
    if(!e.detail.value.phone){
@@ -17,7 +17,7 @@
    <view class="form-item">
      <view class="text-label">新密码</view>
      <view class="text-value text-password">
-        <input name="password" value="{{password}}" password="{{show}}" placeholder="请输入新密码" />
+        <input name="password" value="{{password}}" bindinput="handlePasswordInput" password="{{show}}" placeholder="请输入新密码" />
        <image src="../../assets/images/show.png" class="show" wx:if="{{!show}}" bindtap="showPassword"></image>
        <image src="../../assets/images/none.png" class="show" wx:if="{{show}}" bindtap="showPassword"></image>
      </view>
@@ -25,7 +25,7 @@
    <view class="form-item">
      <view class="text-label">确认密码</view>
      <view class="text-value text-password">
-        <input name="verifyPassword" bindblur="bindBlurInput" value="{{verifyPassword}}" password="{{showVerify}}" placeholder="请输入确认密码" />
+        <input name="verifyPassword" bindinput="handleVerifyPasswordInput" value="{{verifyPassword}}" password="{{showVerify}}" placeholder="请输入确认密码" />
        <image src="../../assets/images/show.png" class="show" wx:if="{{!showVerify}}" bindtap="showPasswordVerify"></image>
        <image src="../../assets/images/none.png" class="show" wx:if="{{showVerify}}" bindtap="showPasswordVerify"></image>
      </view>
@@ -15,6 +15,8 @@ Page({
      requestCodeSuccess: true,
      randCodeImage: '' // 验证码
    },
+    vals: [], // 禁止密码粘贴用到的数组
+    password: '', // 密码
    rsaPublicKey: '', // 公钥
    flag: false
  },
@@ -48,6 +50,45 @@ Page({
      })
    })
  },
+  clearrepeatval(){
+    this.data.vals = []
+    wx.showToast({
+      title: '禁止复制粘贴请手动输入',
+      icon: 'none',
+      duration: 2000
+    })
+    this.setData({
+      password: ''
+    })
+    return
+  },
+  handlePasswordInput(e) { //禁止输入中复制粘贴
+    // 获取当前数组
+    const vals = this.data.vals
+    // 获取当前输入的值
+    const currentval = e.detail.value.replace(/\s+/g, "")
+    if(currentval){ // 如果值存在追加到vals中
+      vals.push(currentval)
+    }
+    if(vals.length == 1 ){ 
+      const v = vals[vals.length-1].length
+      if(v > 1){ // 如果第一个的长度就大于1 说明是粘贴过来的
+        this.clearrepeatval()
+      }
+    }
+    if(vals.length > 1){ 
+      // 如果值数组大于1 就获取最后一个值长度和倒数第二个值长度 
+      // 比较值长度差如果大于1 则粘贴的
+      const lastv = vals[vals.length-1].length // 获取最后一个值的长度
+      const secondv = vals[vals.length-2].length // 获取倒数第二个值得长度
+      const dis = lastv - secondv
+      if(dis>1){
+        this.clearrepeatval()
+      }
+    }
+    // 最后赋值
+    this.data['password'] = currentval
+  },
  // 提交
  formSubmit(e) {
    if(!e.detail.value.phone){
@@ -10,7 +10,7 @@
    <view class="form-item">
      <view class="text-label">密码</view>
      <view class="text-value text-password">
-        <input name="password" value="{{password}}" password="{{show}}" placeholder="请输入密码" />
+        <input name="password" value="{{password}}" password="{{show}}" placeholder="请输入密码" bindinput="handlePasswordInput" />
        <image src="../../assets/images/show.png" class="show" wx:if="{{!show}}" bindtap="showPassword"></image>
        <image src="../../assets/images/none.png" class="show" wx:if="{{show}}" bindtap="showPassword"></image>
      </view>
@@ -10,6 +10,8 @@ Page({
    password: '', // token
    newPassword: '', // 密码
    verifyPassword: '', // 确认密码
+    valsNew: [],
+    valsVerify: [],
    rsaPublicKey: '',
    flag: false,
    show: true, // 默认显示的是闭眼睛
@@ -25,6 +27,86 @@ Page({
      showVerify: !this.data.showVerify
    })
  },
+  clearrepeatval(){
+    this.data.valsNew = []
+    wx.showToast({
+      title: '禁止复制粘贴请手动输入',
+      icon: 'none',
+      duration: 2000
+    })
+    this.setData({
+      newPassword: ''
+    })
+    return
+  },
+  clearrepeatvalVerify(){
+    this.data.valsVerify = []
+    wx.showToast({
+      title: '禁止复制粘贴请手动输入',
+      icon: 'none',
+      duration: 2000
+    })
+    this.setData({
+      verifyPassword: ''
+    })
+    return
+  },
+  // 新密码的输入
+  handlePasswordInput(e) { //禁止输入中复制粘贴
+    // 获取当前数组
+    const vals = this.data.valsNew
+    // 获取当前输入的值
+    const currentval = e.detail.value.replace(/\s+/g, "")
+    if(currentval){ // 如果值存在追加到vals中
+      vals.push(currentval)
+    }
+    if(vals.length == 1 ){ 
+      const v = vals[vals.length-1].length
+      if(v > 1){ // 如果第一个的长度就大于1 说明是粘贴过来的
+        this.clearrepeatval()
+      }
+    }
+    if(vals.length > 1){ 
+      // 如果值数组大于1 就获取最后一个值长度和倒数第二个值长度 
+      // 比较值长度差如果大于1 则粘贴的
+      const lastv = vals[vals.length-1].length // 获取最后一个值的长度
+      const secondv = vals[vals.length-2].length // 获取倒数第二个值得长度
+      const dis = lastv - secondv
+      if(dis>1){
+        this.clearrepeatval()
+      }
+    }
+    // 最后赋值
+    this.data['newPassword'] = currentval
+  },
+  // 确认新密码的输入
+  handleVerifyPasswordInput(e) { //禁止输入中复制粘贴
+    // 获取当前数组
+    const vals = this.data.valsVerify
+    // 获取当前输入的值
+    const currentval = e.detail.value.replace(/\s+/g, "")
+    if(currentval){ // 如果值存在追加到vals中
+      vals.push(currentval)
+    }
+    if(vals.length == 1 ){ 
+      const v = vals[vals.length-1].length
+      if(v > 1){ // 如果第一个的长度就大于1 说明是粘贴过来的
+        this.clearrepeatvalVerify()
+      }
+    }
+    if(vals.length > 1){ 
+      // 如果值数组大于1 就获取最后一个值长度和倒数第二个值长度 
+      // 比较值长度差如果大于1 则粘贴的
+      const lastv = vals[vals.length-1].length // 获取最后一个值的长度
+      const secondv = vals[vals.length-2].length // 获取倒数第二个值得长度
+      const dis = lastv - secondv
+      if(dis>1){
+        this.clearrepeatvalVerify()
+      }
+    }
+    // 最后赋值
+    this.data['verifyPassword'] = currentval
+  },
  // 登录
  formSubmit(e) {
    const that = this
@@ -125,7 +207,7 @@ Page({
    })
  },
  onLoad(options){
-    this.data.userInfo = JSON.parse(options.userInfo)
+    // this.data.userInfo = JSON.parse(options.userInfo)
  },
  /**
   * 生命周期函数--监听页面显示
@@ -5,7 +5,7 @@
    <view class="form-item">
      <view class="text-label">密码</view>
      <view class="text-value text-password">
-        <input name="newPassword" bindblur="bindBlurInput" value="{{newPassword}}" password="{{show}}" placeholder="请输入密码" />
+        <input name="newPassword" bindinput="handlePasswordInput" value="{{newPassword}}" password="{{show}}" placeholder="请输入密码" />
        <image src="../../assets/images/show.png" class="show" wx:if="{{!show}}" bindtap="showPassword"></image>
        <image src="../../assets/images/none.png" class="show" wx:if="{{show}}" bindtap="showPassword"></image>
      </view>
@@ -13,7 +13,7 @@
    <view class="form-item">
      <view class="text-label">确认密码</view>
      <view class="text-value text-password">
-        <input name="verifyPassword" bindblur="bindBlurInput" value="{{verifyPassword}}" password="{{showVerify}}" placeholder="请输入确认密码" />
+        <input name="verifyPassword" bindinput="handleVerifyPasswordInput" value="{{verifyPassword}}" password="{{showVerify}}" placeholder="请输入确认密码" />
        <image src="../../assets/images/show.png" class="show" wx:if="{{!showVerify}}" bindtap="showPasswordVerify"></image>
        <image src="../../assets/images/none.png" class="show" wx:if="{{showVerify}}" bindtap="showPasswordVerify"></image>
      </view>
@@ -9,12 +9,13 @@ Page({
   * 页面的初始数据
   */
  data: {
-    form: {
-      oldpassword: '', // 旧密码
-      password: '', // 新密码
-      confirmpassword: '', // 确认新密码
-      rsaPublicKey: '', // 公钥
-    },
+    oldpassword: '', // 旧密码
+    password: '', // 新密码
+    confirmpassword: '', // 确认新密码
+    rsaPublicKey: '', // 公钥
+    valsOld: [],
+    valsNew: [],
+    valsVerify: [],
    showOld: true,
    show: true, // 默认显示的是闭眼睛
    showVerify: true,
@@ -31,9 +32,129 @@ Page({
  },
  showPasswordVerify(){
    this.setData({
-      showVerify: !this.data.showVerify
+      'showVerify': !this.data.showVerify
    })
  },
+  clearrepeatvalOld(){
+    this.data.valsOld = []
+    wx.showToast({
+      title: '禁止复制粘贴请手动输入',
+      icon: 'none',
+      duration: 2000
+    })
+    this.setData({
+      oldpassword: ''
+    })
+    return
+  },
+  clearrepeatval(){
+    this.data.valsNew = []
+    wx.showToast({
+      title: '禁止复制粘贴请手动输入',
+      icon: 'none',
+      duration: 2000
+    })
+    this.setData({
+      password: ''
+    })
+    return
+  },
+  clearrepeatvalVerify(){
+    this.data.valsVerify = []
+    wx.showToast({
+      title: '禁止复制粘贴请手动输入',
+      icon: 'none',
+      duration: 2000
+    })
+    this.setData({
+      confirmpassword: ''
+    })
+    return
+  },
+   // 旧密码的输入
+   handleOldPasswordInput(e) { //禁止输入中复制粘贴
+    // 获取当前数组
+    const vals = this.data.valsOld
+    // 获取当前输入的值
+    const currentval = e.detail.value.replace(/\s+/g, "")
+    if(currentval){ // 如果值存在追加到vals中
+      vals.push(currentval)
+    }
+    if(vals.length == 1 ){ 
+      const v = vals[vals.length-1].length
+      if(v > 1){ // 如果第一个的长度就大于1 说明是粘贴过来的
+        this.clearrepeatvalOld()
+      }
+    }
+    if(vals.length > 1){ 
+      // 如果值数组大于1 就获取最后一个值长度和倒数第二个值长度 
+      // 比较值长度差如果大于1 则粘贴的
+      const lastv = vals[vals.length-1].length // 获取最后一个值的长度
+      const secondv = vals[vals.length-2].length // 获取倒数第二个值得长度
+      const dis = lastv - secondv
+      if(dis>1){
+        this.clearrepeatvalOld()
+      }
+    }
+    // 最后赋值
+    this.data['oldpassword'] = currentval
+  },
+   // 新密码的输入
+   handlePasswordInput(e) { //禁止输入中复制粘贴
+    // 获取当前数组
+    const vals = this.data.valsNew
+    // 获取当前输入的值
+    const currentval = e.detail.value.replace(/\s+/g, "")
+    if(currentval){ // 如果值存在追加到vals中
+      vals.push(currentval)
+    }
+    if(vals.length == 1 ){ 
+      const v = vals[vals.length-1].length
+      if(v > 1){ // 如果第一个的长度就大于1 说明是粘贴过来的
+        this.clearrepeatval()
+      }
+    }
+    if(vals.length > 1){ 
+      // 如果值数组大于1 就获取最后一个值长度和倒数第二个值长度 
+      // 比较值长度差如果大于1 则粘贴的
+      const lastv = vals[vals.length-1].length // 获取最后一个值的长度
+      const secondv = vals[vals.length-2].length // 获取倒数第二个值得长度
+      const dis = lastv - secondv
+      if(dis>1){
+        this.clearrepeatval()
+      }
+    }
+    // 最后赋值
+    this.data['password'] = currentval
+  },
+  // 确认新密码的输入
+  handleVerifyPasswordInput(e) { //禁止输入中复制粘贴
+    // 获取当前数组
+    const vals = this.data.valsVerify
+    // 获取当前输入的值
+    const currentval = e.detail.value.replace(/\s+/g, "")
+    if(currentval){ // 如果值存在追加到vals中
+      vals.push(currentval)
+    }
+    if(vals.length == 1 ){ 
+      const v = vals[vals.length-1].length
+      if(v > 1){ // 如果第一个的长度就大于1 说明是粘贴过来的
+        this.clearrepeatvalVerify()
+      }
+    }
+    if(vals.length > 1){ 
+      // 如果值数组大于1 就获取最后一个值长度和倒数第二个值长度 
+      // 比较值长度差如果大于1 则粘贴的
+      const lastv = vals[vals.length-1].length // 获取最后一个值的长度
+      const secondv = vals[vals.length-2].length // 获取倒数第二个值得长度
+      const dis = lastv - secondv
+      if(dis>1){
+        this.clearrepeatvalVerify()
+      }
+    }
+    // 最后赋值
+    this.data['form.confirmpassword'] = currentval
+  },
  // 提交
  formSubmit(e) {
    if(!e.detail.value.oldpassword){
@@ -4,7 +4,7 @@
    <view class="form-item">
      <view class="text-label">旧密码</view>
      <view class="text-value text-password">
-        <input name="oldpassword" value="{{oldpassword}}" password="{{showOld}}" placeholder="请输入旧密码" />
+        <input name="oldpassword" value="{{oldpassword}}" bindinput="handleOldPasswordInput" password="{{showOld}}" placeholder="请输入旧密码" />
        <image src="../../assets/images/show.png" class="show" wx:if="{{!showOld}}" bindtap="showPasswordOld"></image>
        <image src="../../assets/images/none.png" class="show" wx:if="{{showOld}}" bindtap="showPasswordOld"></image>
      </view>
@@ -12,7 +12,7 @@
    <view class="form-item">
      <view class="text-label">新密码</view>
      <view class="text-value text-password">
-        <input name="password" value="{{password}}" password="{{show}}" placeholder="请输入新密码" />
+        <input name="password" value="{{password}}" bindinput="handlePasswordInput" password="{{show}}" placeholder="请输入新密码" />
        <image src="../../assets/images/show.png" class="show" wx:if="{{!show}}" bindtap="showPassword"></image>
        <image src="../../assets/images/none.png" class="show" wx:if="{{show}}" bindtap="showPassword"></image>
      </view>
@@ -20,7 +20,7 @@
    <view class="form-item">
      <view class="text-label">确认新密码</view>
      <view class="text-value text-password">
-        <input name="confirmpassword" value="{{confirmpassword}}" password="{{showVerify}}" placeholder="请输入确认新密码" />
+        <input name="confirmpassword" value="{{confirmpassword}}" bindinput="handleVerifyPasswordInput" password="{{showVerify}}" placeholder="请输入确认新密码" />
        <image src="../../assets/images/show.png" class="show" wx:if="{{!showVerify}}" bindtap="showPasswordVerify"></image>
        <image src="../../assets/images/none.png" class="show" wx:if="{{showVerify}}" bindtap="showPasswordVerify"></image>
      </view>