layui custom form validation

The verification of layui form element only needs to add lay-verify to the element, and layui provides the following values.

required（必填项）
phone（手机号）
email（邮箱）
url（网址）
number（数字）
date（日期）
identity（身份证）
自定义值

Supports verification of multiple rules at the same time, format: lay-verify=”Verify A|Verify B”

如：lay-verify=”required|phone|number”

In addition, in addition to our built-in verification rules, you can also set any value for him, such as lay-verify=”pass”, then you need to use the form.verify() method to define a verification rule for pass

Example:

<div class="layui-form-item">
  <label for="" class="layui-form-label">请输入邮件</label>
  <div class="layui-input-block">
   <input type="text" placeholder="请输入邮件" lay-verify="email" class="layui-input">
  </div>
 </div>

When you fill in an illegal email, you will be prompted with a smiley face icon when you click Submit, which is great!

Custom check:

form.verify({
 username: function(value, item){ //value：表单的值、item：表单的DOM对象
 if(!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)){
  return '用户名不能有特殊字符';
 }
 if(/(^\_)|(\__)|(\_+$)/.test(value)){
  return '用户名首尾不能出现下划线\'_\'';
 }
 if(/^\d+\d+\d$/.test(value)){
  return '用户名不能全为数字';
 }
 }

 //我们既支持上述函数式的方式，也支持下述数组的形式
 //数组的两个值分别代表：[正则匹配、匹配不符时的提示文字]
 ,pass: [
 /^[\S]{6,12}$/
 ,'密码必须6到12位，且不能出现空格'
 ]
});

After you customize the verification rules similar to the above, you only need to assign the key to the lay-verify attribute of the input box:

<input type="text" lay-verify="username" placeholder="请输入用户名">
<input type="password" lay-verify="pass" placeholder="请输入密码">

 

Reposted from https://www.jb51.net/article/169250.htm