当使用layui的验证规则,比如 手机,

<input type="text" name="userName" lay-verify="phone" placeholder="" autocomplete="off" class="layui-input">

此时,该输入框可为空, 表单就提交不了。

可自定义验证规则, 即为空时,不校验, 不为空时, 要校验。

自定义的规则如下:

admin.v_email = function(value, item){
var exp = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
if(value && !exp.test(value) ){
return '邮箱格式不正确';
}
} admin.v_phone = function(value, item){
var exp = /^1[0-9]{10}$/;
if(value && !exp.test(value) ){
return '请输入正确的手机';
}
} admin.v_url = function(value, item){
var exp = /(^#)|(^http(s*):\/\/[^\s]+\.[^\s]+)/;
if(value && !exp.test(value) ){
return '链接格式不正确';
}
} admin.v_number = function(value, item){
if(value && isNaN(value) ){
return '只能填写数字';
}
} admin.v_date = function(value, item){
var exp = /^(\d{4})[-\/](\d{1}|0\d{1}|1[0-2])([-\/](\d{1}|0\d{1}|[1-2][0-9]|3[0-1]))*$/;
if(value && !exp.test(value) ){
return '日期格式不正确';
}
} admin.v_identity = function(value, item){
var exp =/(^\d{15}$)|(^\d{17}(x|X|\d)$)/;
if(value && !exp.test(value) ){
return '请输入正确的身份证';
}
}

使用方法:

<input type="text" name="userName" lay-verify="v_phone" placeholder="" autocomplete="off" class="layui-input">
form.verify({
v_email:admin.v_email,
v_phone:admin.v_phone,
v_url:admin.v_url,
v_number:admin.v_number,
v_date:admin.v_date,
})

00008 - layui 表单验证,需要验证,但非必输的更多相关文章

  1. layui表单验证

    layui表单元素的校验只需在元素上加入lay-verify,layui提供了以下值. required(必填项) phone(手机号) email(邮箱) url(网址) number(数字) da ...

  2. 推荐几款很棒的 JavaScript 表单美化和验证插件

    表单元素让人爱恨交加.作为网页最重要的组成部分,表单几乎无处不在,从简单的邮件订阅.登陆注册到复杂的需要多页填写的信息提交功能,表单都让开发者花费了大量的时间和精力去处理,以期实现好用又漂亮的表单功能 ...

  3. form表单的ajax验证2

    form表单的ajax验证2: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"&g ...

  4. 在Tomcat中采用基于表单的安全验证

    .概述   (1)基于表单的验证 基于From的安全认证可以通过TomcatServer对Form表单中所提供的数据进行验证,基于表单的验证使系统开发者可以自定义用户的登陆页面和报错页面.这种验证方法 ...

  5. vue同一页面中拥有两个表单时,验证问题

    问题:如果vue的同一个页面拥有两个表单.验证第一个表单时没有通过就切换到第二个,那么第二个表单会出现验证错误的信息 我们可以通过为两个表单添加ref属性 之后在通过调用resetFields()方法 ...

  6. 如何在.Net Core MVC中为动态表单开启客户端验证

    非Core中的请参照: MVC的验证 jquery.validate.unobtrusive mvc验证jquery.unobtrusive-ajax 参照向动态表单增加验证 页面引入相关JS: &l ...

  7. javascprit form表单提交前验证以及ajax返回json

    1.今天要做一个手机验证码验证的功能.需求是前端页面点击发送 短信验证码,后台接收后通过ajax返回到前端,之后前端在提交时候进行验证.思路很简单,不过做的过程还是学到不少的东西. 1.ajax请求后 ...

  8. 第一百八十六节,jQuery,验证表单插件,Ajax 表单插件,验证和提交表单

    jQuery,验证表单插件,Ajax 表单插件,验证和提交表单 HTML <form id="reg" method="post" action=&quo ...

  9. Angular Material表单提交及验证

    AngularJS中一些表单验证属性: 修改过的表单,只要用户修改过表单,无论输入是否通过验证,该值都将返回false{formName}.{inputFieldName}.$dirty 合法的表单, ...

随机推荐

  1. ansible的剧本play(四)

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAA68AAAETCAYAAADZDzDOAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjw

  2. 咦,Java拆分个字符串都这么讲究

    提到 Java 拆分字符串,我猜你十有八九会撂下一句狠话,"这有什么难的,直接上 String 类的 split() 方法不就拉到了!"假如你真的这么觉得,那可要注意了,事情远没这 ...

  3. js 函数的多图片懒加载(lazy) 带插件版完整解析

    前言:         本人纯小白一个,有很多地方理解的没有各位大牛那么透彻,如有错误,请各位大牛指出斧正!小弟感激不尽.         本篇文章为您分析一下原生JS实现图片懒加载效果 页面需求 1 ...

  4. HTML模版组件

    1.介绍 BootStrap (最好看的) css js [x] 学习 BootStrap 规则 jQueryUI (美观一般,偏后台.*) css js [x] 学习 jQueryUI 规则 Eas ...

  5. python自动化测试开发利器ulipad最佳实践(可写python测试代码也可编写selenium、Appium等)...

    介绍 UliPad是一个国人开发的python轻量级编辑器,导向和灵活的编程器.它如类浏览器,代码自动完成许多功能,如:HTML查看器,目录浏览器,向导等. 下载与安装 下载地址:https://py ...

  6. WSFC与DFS

    WSFC里面的文件服务器群集,文件始终是一份,数据始终存放在群集磁盘中,通过群集来维持文件服务器这项服务始终持续可用,在2012之前同一时间WSFC只能有一台节点对外提供文件服务,2012开始群集引入 ...

  7. Centos7下查询jdk安装路径

    今天一个小实验需要安装jdk,用命令java -version查询了一下,原来Centos7自带OpenJDK的环境,但是需要手动配置/etc/profile文件,于是开始找java的安装路径.... ...

  8. CodeForces - 1047B Cover Points

    B. Cover Points time limit per test1 second memory limit per test256 megabytes inputstandard input o ...

  9. java基础知识备忘

    1.java内存分配 a.寄存器cup -- 暂不涉及 b.本地方法栈  -- 虚拟机调用windows功能用的,比如创建文件夹 c.方法区  -- 存放 .class文件,负责存放方法 d.栈 -- ...

  10. Web框架,Hibernate向数据库插入数据,数据库没有值怎么办?

    用web框架技术,使用Hibernate向数据库添加信息,控制台显示插入成功的语句,可是数据库却没有值:错误如下: (1)不要自己创建数据库!!,Web框架可以自己自动生成,自己创建可能会报错! (2 ...