美文网首页
常用的正则及输入框的验证

常用的正则及输入框的验证

作者: Hsugar | 来源:发表于2019-04-12 16:54 被阅读0次
  • 邮箱
rules:{
  email: [{
    trigger,
    pattern: /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/, //eslint-disable-line
    message: `${labels.mail}格式不正确!`
  }],
}
  • 数字输入框
<template>
<el-row :gutter="10">
  <el-col :lg="6" :md="6">
    <el-form-item class="select-campus" label="课时" prop="courseTime">
        <el-input
         placeholder="小时"
        @keyup.native="handleChange"
        v-model="formData.courseTime"
        @blur="handleChange('courseTime')"
        ></el-input>
    </el-form-item>
</el-col>
<el-col :lg="6" :md="6">
    <el-form-item class="select-point" label="次数" prop="courseFrequency">
        <el-input
          placeholder="次数"
          @keyup.native="handleChangeVal"
          v-model="formData.courseFrequency"
          @blur = "onBlur('courseFrequency')"
          :maxlength="2"
      ></el-input>
    </el-form-item>
  </el-col>
</el-row>
</template>
<script>
        /**
         * 校验输入框数字
         * 允许输入两位整数、两位小数
         * @return {[type]} [名称]
         */
        handleChange(type) {
            let obj = event.target;
            obj.value = obj.value.replace(/[^\d.]/g, ""); //清除“数字”和“.”以外的字符
            obj.value = obj.value.replace(/^\./g, ""); //验证第一个字符是数字而不是.
            obj.value = obj.value.replace(/\.{2,}/g, "."); //只保留第一个. 清除多余的
            obj.value = obj.value
                .replace(".", "$#$")
                .replace(/\./g, "")
                .replace("$#$", ".");
            obj.value = obj.value.replace(/^(\-)*(\d+)\.(\d\d).*$/, "$1$2.$3"); //只能输入两个小数
            if(obj.value.length == 3){      //限制两位数
                if(obj.value[2] != '.' && obj.value[1] !='.'){
                  obj.value = obj.value.slice(0,2)
                }
            }
            this.formData[type] = obj.value
        },
        
        /**
         * 校验输入框数字
         * 只允许输入整数
         * @return {[type]} [description]
         */
        handleChangeVal() {
            let obj = event.target;
            event.target.value = event.target.value.replace(/[^\d]/g, "");
        },
        onBlur(type){
            console.log(event.target.value)
            event.target.value = event.target.value.replace(/[^\d]/g, "");
            this.formData[type] = event.target.value
            //item = event.target.value
        },
</script>

相关文章

网友评论

      本文标题:常用的正则及输入框的验证

      本文链接:https://www.haomeiwen.com/subject/sfaqwqtx.html