layui 表单验证(内置+自定义)


<input type="text" name="username" id="username" required  lay-verify="required|username" value="{$rsu['real_name']}" placeholder="真实姓名" autocomplete="off" class="layui-input">
<input name="location" class="layui-input" lay-verify="number|Ndouble" type="text"/>
<input type="text" lay-verify="email">
<input type="text" lay-verify="username" placeholder="请输入用户名">
<input type="password" lay-verify="pass" placeholder="请输入密码">
还同时支持多条规则的验证,如下:
<input type="text" lay-verify="required|phone|number">

   

<script>
    layui.use(['form','jquery','layer'], function(){
          var layer = layui.layer
          ,form = layui.form
          ,$= layui.$;
          
          
          form.verify({
              username: function(value, item){ 
                  //value:表单的值、item:表单的DOM对象
                  if(!new RegExp("^[\u4e00-\u9fa5\]+$").test(value)){
                      return '姓名只能是中文';
                  }
              },
              Ndouble:[ /^[1-9]\d*$/,'只能输入整数哦'],
              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位,且不能出现空格']
              
          })
        
          
    });
</script>

这是layui内置的一些验证:

lay-verify        required(必填项)
        phone(手机号)
        email(邮箱)
        url(网址)
        number(数字)
        date(日期)
        identity(身份证



最新回复 (0)
发新帖