Layui

layui中使用lay-verify进行非必填项校验

文 / 菜菜___ 来源 / 简书 阅读 / 928 3年前
使用layui时验证数字类型,lay-verify=“number”,发现如果不输入数据也会认为数据不合法,所有的校验规则,默认都是必填项,但对于非必填项来说是填了才去校验,因此修改了form.js的源码(layui.all.js也有这些校验规则,目前只修改form.js发现生效就没有修改layui.all.js)


修改如下:
在所有的正则表达式前面加:(^$)|
number类型由 !e || isNaN(e) 修改为 e && isNaN(e) 表示不为空并且不是数字
新加整数类型规则:integer: [/^\d*$/, "只能填写整数"],
新加小写字母类型规则:smallLetter : [/(^$)|^[a-z]*$/, '必须小写字母!'],
新加金额类型规则:amount : [/(^$)|(^[1-9]{1}[0-9]*$)|(^[0-9]*\.[0-9]{2}$)/, '金额输入不合法!(仅可输入整数或带两个小数点数字)'],
新加密码类型规则:pass: [/(^$)|^[\S]{6,12}$/, '密码必须6到12位,且不能出现空格!']
verify: {
  required: [/[\S]+/, "必填项不能为空"],
    phone: [/(^$)|^1\d{10}$/, "请输入正确的手机号"],
    email: [/(^$)|^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/, "邮箱格式不正确"],
    url: [/(^$)|(^#)|(^http(s*):\/\/[^\s]+\.[^\s]+)/, "链接格式不正确"],
    number: function (e) {
        if (e && isNaN(e))return "只能填写数字"
    },
    integer: [/^\d*$/, "只能填写整数"],
    date: [/(^$)|^(\d{4})[-\/](\d{1}|0\d{1}|1[0-2])([-\/](\d{1}|0\d{1}|[1-2][0-9]|3[0-1]))*$/, "日期格式不正确"],
    identity: [/(^$)|(^\d{15}$)|(^\d{17}(x|X|\d)$)/, "请输入正确的身份证号"],
    smallLetter : [/(^$)|^[a-z]*$/, '必须小写字母!'],
    amount : [/(^$)|(^[1-9]{1}[0-9]*$)|(^[0-9]*\.[0-9]{2}$)/, '金额输入不合法!(仅可输入整数或带两个小数点数字)'],
    pass: [/(^$)|^[\S]{6,12}$/, '密码必须6到12位,且不能出现空格!']
}

如果该选项为必填:建议使用,lay-verify=“required|number”校验,其中required是校验必填,多种校验规则之间用 | 间隔。


原文链接:https://www.jianshu.com/p/dae6b30c4c01

评论

共0条评论
  • 这篇文章还没有收到评论,赶紧来抢沙发吧~

站点声明:本站转载作品版权归原作者及来源网站所有,原创内容作品版权归作者所有,任何内容转载、商业用途等均须联系原作者并注明来源。

© 2020-2030 qdxcy.cn 版权所有京ICP备13045222号
相关侵权、举报、投诉及建议等,请发E-mail:2323946929@qq.com

友情链接: YzmCMS官方网站 YzmCMS官方论坛