码迷,mamicode.com
首页 > 其他好文 > 详细

layui表单校验

时间:2021-01-22 12:15:17      阅读:0      评论:0      收藏:0      [点我收藏+]

标签:turn   演示   img   dom   ret   生效   否则   ext   number   

官方文档(在2.x 里面   版本1.0.9 的文档 和演示例子 是没有的) 

https://www.layui.com/doc/modules/form.html

 

一,代码

1,官方内置校验规则

单条校验

<!--email 是官方内置的  还有很多  -->
<input type="text" lay-verify="email"> 

技术图片

 

 

 多条校验

<!--还同时支持多条规则的验证,如下:-->
<input type="text" lay-verify="required|phone|number">

2,自定义校验规则

表单

<input type="text" lay-verify="username">

自定义校验方法 一

form.verify({
  username: function(value, item){ //value:表单的值、item:表单的DOM对象
    if(!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)){
      return ‘用户名不能有特殊字符‘;
    }
  }
});      

自定义校验方法 二

form.verify({
username: [
    /^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$/
    ,‘用户名不能有特殊字符‘
  ] 
}); 

注意点   自定义方法 一点要放在 layui.use 里面  一定要拿到 form 的实例 才会生效  否则不生效

layui.use([‘form‘], function(){
var form = layui.form
form.verify({
username: [
    /^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$/
    ,‘用户名不能有特殊字符‘
  ] 
}); 
})

 

  

 

layui表单校验

标签:turn   演示   img   dom   ret   生效   否则   ext   number   

原文地址:https://www.cnblogs.com/mangoubiubiu/p/14310949.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!