[笔记]表单校验validate.js

export function validate (item) {// console.log(item)// 手机号校验const phoneValidate = (rules, value, callback) => {// console.log(value)if (value) {if (!(/^1\d{10}$/.test(value))) {callback(new Error('请输入正确的手机号'))} else {callback()}} else {callback()}}const telValidate = (rules, value, callback) => {// console.log(value)if (value) {if (!(/(\(\d{3,4}\)|\d{3,4}-|\s)?\d{7,14}/.test(value)) && !(/^1\d{10}$/.test(value))) {callback(new Error('请输入正确的电话号码'))} else {callback()}} else {callback()}}const LicensePlate = (rules, value, callback) => {console.log(value)if (value) {if (!(/^(([京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领][A-Z](([0-9]{5}[DF])|([DF]([A-HJ-NP-Z0-9])[0-9]{4})))|([京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领][A-Z][A-HJ-NP-Z0-9]{4}[A-HJ-NP-Z0-9挂学警港澳使领]))$/.test(value))) {callback(new Error('请输入正确的车牌号'))} else {callback()}} else {callback()}}// const priceValidate = (rules, value, callback) => {//     // console.log(value)//     if (value) {//         if (!(/^1[34578]\d{9}$/.test(value))) {//             callback(new Error('请输入正确的手机号'))//         } else {//             callback()//         }//     } else {//         callback()//     }// }// 0<X<1const discountValidate = (rules, value, callback) => {if (value) {if (value > 1 || value <= 0) {callback(new Error('请输入大于0小于1的数字'))} else {callback()}} else {callback()}}const numberValidate = (rules, value, callback) => {if (value) {// if (!/^[0-9]*$/.test(value) || value - 0 === 0) {if (value - 0 <= 0 || value - 0 >= 10000) {callback(new Error('请输入正确的金额'))} else {callback()}} else {callback()}}// 校验const arrayValidate = (rules, value, callback) => {if (Array.isArray(value)) {if (value.length === 0) {callback(new Error('该项为必填项'))} else {callback()}} else {callback(new Error('该输入项需要是数组'))}}const noRepeat = (rules, value, callback) => {if (value) {let repeatLength = rules.repeatLength || 2if (value.length >= repeatLength && /^(\d)\1+$/.test(value)) {callback(new Error('不允许输入相同的数字'))} else {callback()}} else {callback()}}let rules = []if (item.required && !item.msg) {rules.push({ required: true, message: '该项为必填项', trigger: ['change'] })}if (item.required && item.msg) {rules.push({ required: true, message: item.msg, trigger: ['change'] })}if (item.max && !item.min) {rules.push({ min: 1, max: item.max, message: `最多输入${item.max}个字符!`, trigger: ['change'] })}if (item.min && item.max) {rules.push({ min: item.min, max: item.max, message: `字符长度在${item.min}至${item.max}之间!`, trigger: ['change'] })}if (item.noRepeat) {rules.push({ validator: noRepeat, message: '不允许输入相同的数字', trigger: ['change'], repeatLength: item.repeatLength })}if (item.type) {let type = item.typeswitch (type) {case 'C+E+)':rules.push({ pattern: /^[/(/)A-Za-z\u4e00-\u9fa5]+$/, message: '只允许输入中文和英文字母', trigger: ['change'] })breakcase 'C+E':rules.push({ pattern: /^[A-Za-z\u4e00-\u9fa5]+$/, message: '只允许输入中文和英文字母', trigger: ['change'] })breakcase 'C+E+N':rules.push({ pattern: /^[0-9A-Za-z\u4e00-\u9fa5]+$/, message: '只允许输入中文和英文字母和数字', trigger: ['change'] })breakcase 'email':rules.push({ type: 'email', message: '请输入正确的邮箱地址', trigger: ['change'] })breakcase 'array':rules.push({ type: 'array', message: '该项为必填项', trigger: ['change'] })breakcase 'phone':rules.push({ validator: phoneValidate, trigger: ['change'] })breakcase 'LicensePlate':rules.push({ validator: LicensePlate, trigger: ['change'] })breakcase 'tel':rules.push({ validator: telValidate, trigger: ['change'] })breakcase 'number2':rules.push({ pattern: /((^[1-9]\d*)|^0)(\.\d{0,2}){0,1}$/, message: '请输入正确的金额', trigger: ['change'] })rules.push({ validator: numberValidate, message: '请输入正确的金额' })breakcase 'number':rules.push({ type: 'number', message: '必须为数字' })breakcase 'EN':rules.push({ pattern: /^[0-9a-zA-Z]+$/, message: '请输入字母和数字的组合', trigger: ['change'] })breakcase 'EN.':rules.push({ pattern: /^[0-9a-zA-Z/.]+$/, message: '请输入字母和数字的组合', trigger: ['change'] })breakcase 'ENS':rules.push({ pattern: /^[0-9a-zA-Z/.\s]+$/, message: '请输入字母和数字的组合', trigger: ['change'] })breakcase 'E+N':rules.push({ pattern: /^(?=.*[0-9])(?=.*[a-zA-Z])$/, message: '请输入字母和数字的组合', trigger: ['change'] })breakcase 'discount':rules.push({ validator: discountValidate, message: '请输入大于0小于1的数字', trigger: ['change'] })breakcase 'array1':rules.push({ type: 'array', message: '请至少选择一个选项', trigger: ['change'] })rules.push({ validator: arrayValidate, trigger: ['change'] })breakcase 'price':rules.push({ pattern: /((^[1-9]\d*)|^0)(\.\d{0,2}){0,1}$/, message: '请输入正确的价格', trigger: ['change'] })breakcase 'num':rules.push({ pattern: /^\d+$/, message: '请输入正整数', trigger: ['change'] })breakcase 'qq':rules.push({ pattern: /^\d{5,12}$/, message: '请输入正确的QQ号', trigger: ['change'] })breakcase 'floatNumber':rules.push({ pattern: /^\d+(\.\d+)?$/, message: '请输入正整数，支持小数', trigger: ['change'] })breakcase 'enterpriseCreditIdentifier':rules.push({ pattern: /^(?=.*[a-zA-Z])(?=.*[\d]).{18}$/, message: '社会信用代码应为18位的数字和字母组合', trigger: ['change'] })breakcase 'enterpriseBusinessCertificate':rules.push({ pattern: /^(?=.*[a-zA-Z])(?=.*[\d]).{12}$/, message: '许可证号应为12位的数字和字母组合', trigger: ['change'] })breakcase 'idcard':rules.push({pattern: /^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$|^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/,message: '请输入正确的身份证号',trigger: ['change']})breakcase 'url':rules.push({ pattern: /(https?|ftp|file):\/\/[-A-Za-z0-9+&@#/%?=~_|!:,.;]+[-A-Za-z0-9+&@#/%=~_|]/, message: '请输入正确的网址', trigger: ['change'] })breakcase 'post':rules.push({ pattern: /[1-9]\d{5}(?!\d)/, message: '请输入正确的邮政编码', trigger: ['change'] })breakcase 'positiveInt':rules.push({ pattern: /^[1-9]\d*$/, message: '请输入正整数', trigger: ['change'] })breakdefault: break}}return rules
}

[笔记]表单校验validate.js相关推荐

关于Easy ui 的表单验证validate.js实时验证
新建 validType.js文件 1.一些常用的验证 $(function() {//设置text需要验证$('input[type=text]').validatebox();//自定义valid ...
jQuery表单校验jquery.validate.js的使用
jQuery是一个快速.简洁的js库,为网站的快速开发简化了HTML文档遍历,事件处理,动画,以及Ajax交互.使用jQuery将极大的提高编写javascript代码的效率, 让写出来的代码更加优雅 ...
js-最常用的js表单校验1
最近写了无数各种形式的表单,记录下奇奇怪怪的校验规则~ 一:首先是element自带的rules校验规则: element作为常用框架,自带rules属性简单易懂,官方文档一目了然,不再赘述,应付常用 ...
【前端2】js：原始类型，运算符，调试，页面加载，轮播图，Bom（对象，时钟），Dom（全选全不选，省市级联，隔行/触摸换色，表单校验）
文章目录 1.js两种引入:js最终要引入到html在浏览器中运行 2.js五大原始类型:undefined 3.js的运算符和流程控制:js不支持单&和单|性能低 4.案例_99乘法表:So ...
Vue.js + Nuxt.js 项目中使用 Vee-validate 表单校验
vee-validate 是为 Vue.js 量身打造的表单校验框架,允许您校验输入的内容并显示对应的错误提示信息.它内置了很多常见的校验规则,可以组合使用多种校验规则,大部分场景只需要配置就能实现开 ...
轻量级的jQuery表单校验插件: Happy.js
当前已经有许多jQuery表单校验插件,并且有些也很不错,但这些插件功能太强大,使用比较复杂.如果你想找一个简单点的插件 Happy.js 刚好是一个很好的选择. 这个插件是轻量级的,所以只支持一些输 ...
vue form validate 多个input_Vue表单校验插件Vuerify使用详细教程及示例
点击右上方红色按钮关注"web秀",让你真正秀起来前言表单校验,在开发中是非常常见的,为了防止用户误操作,填写错误数据,亦或是防止用户恶意提交数据等,都需要前端同学来做一些简单 ...
jquery validate表单校验
https://blog.csdn.net/pengjunlee/article/details/80685500 jquery validate表单校验
easyui收派标准客户端表单校验
easyui收派标准客户端表单校验 js代码: //对收派标准的save按钮,添加点击事件 $("#save").click(function(){//判断form数据是否都通过校 ...

[笔记]表单校验validate.js

[笔记]表单校验validate.js相关推荐

最新文章

热门文章