zoukankan      html  css  js  c++  java
  • 判断输入的字符是否为整数(包含整数格式验证)

    在项目中,很多时候都会有输入框的存在,为了防止用户随意输入都会有限制,最近遇到一种需求,输入价格时只能输入数字类型,并且输入的数字格式要正确,
     
    在网上搜索的很多验证数字的对格式没有校验,所以自己就完善了一下,使用的正则表达式,但是由于自己正则知识实在匮乏,写的比较low,不过也能实现最终的效果吧
     
    能通过验证的数字类型: 0.9, 1, 20....
     
    不能通过验证的数字: 00.9, 0, 09, 99., 其他包含字母,标点符号的字符串
     
    项目里的输入框是用的element的form表单,form表单自带验证规则,我这个是写在自定义验证规则里的,不过修改一下也可以单独使用
     
    var checkPrice = (rule, value, callback) => {
      let zero = /^0+d*$/ // 过滤以0开头的数据(不含小数点)
      let dublue = /^0{2,}.d+$/ // 过滤小数点前有两个以上0的数字
      let point = /^d+.?d+$/ //  以数字开头,可以允许出现一次或0次小数点,以数字结尾(这里的数字必须有两个)
      let reg = /^[1-9]{1}$/ // 匹配只有一个数字的情况
      if (!value) {
        callback(new Error('Please enter the unit price'))
      }
      setTimeout(() => {
        if (zero.test(value) || dublue.test(value)) { // 首先过滤掉错误的数据
          callback(new Error('Enter the correct number format')) // 调取输入框验证的方法
        } else if (point.test(value) || reg.test(value)) { // 匹配数据,如果输入的数字只有一位数时用reg匹配
          callback() // 验证通过
        } else {
          callback(new Error('Enter the correct number format'))
        }
      }, 100)
    }
    也可以写成一个函数使用
    function checkPrice (value) {
      let zero = /^0+d*$/ // 过滤以0开头的数据(不含小数点)
      let dublue = /^0{2,}.d+$/ // 过滤小数点前有两个以上0的数字
      let point = /^d+.?d+$/ //  以数字开头,可以允许出现一次或0次小数点,以数字结尾(这里的数字必须有两个)
      let reg = /^[1-9]{1}$/ // 匹配只有一个数字的情况
      if (!value) {
        return false
      }
      if (zero.test(value) || dublue.test(value)) { // 首先过滤掉错误的数据
        return false
      } else if (point.test(value) || reg.test(value)) { // 匹配数据,如果输入的数字只有一位数时用reg匹配
        return true
      } else {
        return false
      }
    }
    使用效果

    因为对正则也是一知半解,所以写得很重复,如果有优化意见希望能告知(*^▽^*)
  • 相关阅读:
    自定义实现wcf的用户名密码验证
    EF6:编写你自己的code first 数据迁移操作(睡前来一篇,翻译的)
    .net 连接Redis
    idea external libraries 只有jdk问题
    MAC vim安装gruvbox主题
    Mac gitk安装与优化
    spring security 4 filter 顺序及作用
    mysql 采样查询 / 间隔查询 / 跳跃查询的两种实现思路
    nginx warn an upstream response is buffered to a temporary file /var/cache/nginx/proxy_temp/ while reading upstream
    nginx日志 logrotate配置
  • 原文地址:https://www.cnblogs.com/steamed-twisted-roll/p/9778860.html
Copyright © 2011-2022 走看看