精华内容
下载资源
问答
  • layui验证规则

    2020-03-01 15:46:37
    下面是layui官方js配置项: { verify: { required: [/[\S]+/, "必填项不能为空"], phone: [/^1\d{10}$/, "请输入正确的手机号"], email: [/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+...

    下面是layui官方js配置项:

    
    {
    	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 "只能填写数字"
    		},
    		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)$)/, "请输入正确的身份证号"]
    	}
    }
    
    

    举个例子

    
    var reg=/(^#)|(^http(s*):\/\/[^\s]+\.[^\s]+)/;
    if(!reg.test(data.field.link)){
         layer.msg('外链格式错误,请输入以http://或https://开头的完整url!',{icon: 5});
         return false;
    }
    
    

    原文链接:https://blog.csdn.net/veloi/article/details/80757469

    展开全文
  • 例子 <input type="text" id='mobile' name="mobile" value="{$list.mobile}" lay-verify=...phone(手机号) email(邮箱) url(网址) number(数字) date(日期) identity(身份证) 自定义验证规则 for

    例子

    <input type="text" id='mobile' name="mobile" value="{$list.mobile}" lay-verify="required|phone|number"; class="form-control">
    

    lay-verify:关键字

    关键字(支持多条规则的验证)
    required (必填项)
    phone(手机号)
    email(邮箱)
    url(网址)
    number(数字)
    date(日期)
    identity(身份证)
    

    自定义验证规则

    form.verify({
        pass: [/(.+){6,12}$/, '密码必须6到12位'],
        repass: function (value) {
            if ($('#pass').val() != $('#L_repass').val()) {
                return '两次密码不一致';
            }
        }
    });
    
    展开全文
  • layui 表单验证案例

    万次阅读 2016-10-26 11:49:08
    文本框,手机,邮箱,textarea等格式的验证 HTML代码: 反馈主题

    js如何判断字符是中文,英文,数字还是字符

    //验证是否是中文
     
    var pattern = new RegExp("[\u4E00-\u9FA5]+");
     
    var str = "中文字符"
     
    if(pattern.test(str)){
     
        alert('该字符串是中文');
     
    }
     
    //验证是否是英文
     
    var pattern2 = new RegExp("[A-Za-z]+");
     
    var str2 = "abcdefsgaaweg"
     
    if(pattern2.test(str2)){
     
        alert('该字符串是英文');
     
    }
     
    //验证是否是数字
     
    var pattern3 = new RegExp("[0-9]+");
     
    var str3 = "234234"
     
    if(pattern3.test(str3)){
     
        alert('该字符串是数字');
     
    }

    所有layui验证:举例只能是英文

    	form.verify({
    		env: function(value, item){ //value:表单的值、item:表单的DOM对象
    			if(!new RegExp("^[A-Za-z]+$").test(value)){
    				return '必须全部为英文';
    			}
    			if(value.length < 5){
    				return '至少5位';
    			}
    		}
    	});

     

    文本框,手机,邮箱,textarea等格式的验证

    1、验证必填项:lay-verify=”required”
    2、数字验证:lay-verify=”int”
    3、验证用户名:lay-verify=”username”
    4、验证手机号:lay-verify=”phone”
    5、验证邮箱:lay-verify=”email”
    6、验证身份证:lay-verify=”identity”
    7、验证日期:lay-verify=”date”
    8、验证链接:lay-verify=”url”
    9、自定义密码验证:lay-verify=”pass”

     

    <script src="layui/layui.js"></script>

    <script src="layui/lay/dest/layui.all.js"></script> 

    <link rel="stylesheet" href="layui/css/layui.css"> 

    HTML代码:

    <form class="layui-form" action="">
                              <div class="layui-form-item">
                                <label class="layui-form-label">反馈主题</label>
                                <div class="layui-input-block">
                                  <input name="title" class="layui-input" type="text" placeholder="请输入标题" autocomplete="off" lay-verify="title">
                                </div>
                              </div>
                              <div class="layui-form-item">
                                <label class="layui-form-label">姓名</label>
                                <div class="layui-input-block">
                                  <input name="fname" class="layui-input" type="text" placeholder="请输入姓名" autocomplete="off" lay-verify="fname">
                                </div>
                              </div>
                              <div class="layui-form-item">
                                <label class="layui-form-label">手机</label>
                                <div class="layui-input-block">
                                  <input name="phone" class="layui-input" type="tel" autocomplete="off" placeholder="请输入手机" lay-verify="phone">
                                </div>
                              </div>
                              <div class="layui-form-item">
                                <label class="layui-form-label">邮箱</label>
                                <div class="layui-input-block">
                                  <input name="email" class="layui-input" type="text" autocomplete="off" placeholder="请输入邮箱" lay-verify="email">
                                </div>
                              </div>
                              <div class="layui-form-item">
                                <label class="layui-form-label">单选框</label>
                                <div class="layui-input-block">
                                  <input name="sex" title="男" type="radio" checked="" value="男">
                                  <input name="sex" title="女" type="radio" value="女">
                                  <input name="sex" title="保密" type="radio" value="密">
                                </div>
                              </div>
                              <!--<div class="layui-form-item layui-form-text">
                                <label class="layui-form-label">普通文本域</label>
                                <div class="layui-input-block">
                                  <textarea class="layui-textarea" placeholder="请输入内容">请输入内容</textarea>
                                </div>
                              </div>-->
                              <div class="layui-form-item layui-form-text">
                                <label class="layui-form-label">内容</label>
                                <div class="layui-input-block">
                                  <textarea class="layui-textarea layui-hide"  name="contact" id="LAY_demo_editor" lay-verify="contact"></textarea>
                                </div>
                              </div>
                              <div class="layui-form-item">
                                <div class="layui-input-block">
                                  <button class="layui-btn" lay-filter="demo2" lay-submit="">跳转式提交</button>
                                  <button class="layui-btn" lay-filter="demo1" lay-submit="">立即提交</button>
                                  <button class="layui-btn layui-btn-primary" type="reset">重置</button>
                                </div>
                              </div>
                            </form>

     

    js验证代码

     

    <script>
    layui.use(['form', 'layedit', 'laydate'], function(){
      var form = layui.form()
      ,layer = layui.layer
      ,layedit = layui.layedit
      ,laydate = layui.laydate;
     
      //自定义验证规则
      form.verify({
    		title: function(value){
    		  if(value.length < 5){
    			return '标题至少得5个字符啊';
    		  }
    		}, fname: function(value){
    		  if(value.length < 4){
    			return '请输入至少4位的用户名';
    		  }
    		}, contact: function(value){
    		  if(value.length < 4){
    			return '内容请输入至少4个字符';
    		  }
    		}
    		,phone: [/^1[3|4|5|7|8]\d{9}$/, '手机必须11位,只能是数字!']
    		,email: [/^[a-z0-9._%-]+@([a-z0-9-]+\.)+[a-z]{2,4}$|^1[3|4|5|7|8]\d{9}$/, '邮箱格式不对']
      });
      
      //创建一个编辑器
      layedit.build('LAY_demo_editor');
      
      //监听提交
      form.on('submit(demo1)', function(data){
        layer.alert(JSON.stringify(data.field), {
          title: '最终的提交信息'
        })
        return false;
      });
      
     
    });
    </script>

     

    其它验证可以看看这里

    http://www.51xuediannao.com/js/jquery/jquery_validate/

     

    展开全文
  • js手机验证方法结合layui使用验证

    千次阅读 2019-08-30 09:35:05
    javascript 手机号电话验证方法封装及使用,结合layui验证使用; //电话验证 function ValidatePhone(val){ var isPhone = /^1[3456789]\d{9}$/;//手机号码 var isMob= /^0?1[0-9][0-9]\d{8}$/;// 座机格式 ....

       javascript 手机号电话验证方法封装及使用,结合layui验证使用;

     //电话验证
            function ValidatePhone(val){
                var isPhone = /^1[3456789]\d{9}$/;//手机号码
                var isMob= /^0?1[0-9][0-9]\d{8}$/;// 座机格式
                if(isMob.test(val)||isPhone.test(val)){
                    return true;
                }else{
                    return false;
                }
            }
            //自定义验证规则
            form.verify({
                phone:function (value) {
                    if(value<=0||value.length <= 0){
                        return '手机号不能为空,请确认输入!';
                    }else if(ValidatePhone(value) == false) {
                        return '手机号格式错误';
                    }
                }
            });

     

    展开全文
  • 官方文档上面除了内置的校验规则外,你还可以自定义验证规则,如果要比较两个输入框的值是否一致的话,就要使用自定义验证规则 使用函数式的方式 confirmPass : function(value) { if ($('input[name=...
  • Layui表单验证

    2021-05-16 11:02:51
    要想使用layui插件中form表单验证,我们首先需要加载初始化layui模块,因为这里用到form表单,所以要加载form模块。 var layer, layuiTable, form;//保存layui模块以便全局使用 $(function(){ //加载&&初始...
  • layui自带验证体系:手机验证、邮箱验证、必填项非空验证、数字验证(含代码、案例) 案例 · 截图: 实例代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta ...
  • layui内置验证

    2020-06-07 21:31:13
    layui内置验证规则 phone:[/(^$)|^1\d{10}$/,'请输入正确的手机号'], email:[/(^$)|^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/,'邮箱格式不正确'], url:[/(^$)|(^#)|(^http(s*):\/\/[^\s]...
  • layui表单验证

    2019-03-14 14:24:00
    layui表单元素的校验只需在元素上加入lay-verify,layui提供了以下值。 required(必填项) phone(手机号) email(邮箱) url(网址) number(数字) date(日期) identity(身份证) 自定义 同时...
  • Layui官方js正则验证手机号,邮箱,网址,日期,身份证。从官方js里挖出来的,正则表达式,赶紧收藏。js正则验证手机号:/^1\d{10}$/js正则验证邮箱:/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4...
  • 在开发中,我们经常需要对一些输入数据通过正则表达式进行有效性验证,基于Layui框架开发下,Layui框架本身已经集成了一些基础的验证,这对我们在前端验证输入的有效性非常便捷,如我们需要验证邮箱的话,可以直接在...
  • layui输入框验证规则

    千次阅读 2020-08-27 15:09:02
    4、验证手机号:lay-verify=”phone” 5、验证邮箱:lay-verify=”email” 6、验证身份证:lay-verify=”identity” 7、验证日期:lay-verify=”date” 8、验证链接:lay-verify=”url” 9、自定义密码验证:lay-...
  • Layui表单验证lay-verify属性 Layui框架有自带的表单验证功能,在input标签中加入lay-verify属性,通过给定不同属性值,来对表单输入框进行不同的验证 layui官网自定义验证: ...
  • layui表单验证demo

    千次阅读 2017-11-30 16:17:17
    表单验证方法很多,使用layui插件自带的验证写法也是很简单。首先到官网http://www.layui.com/下载layui插件,然后按照官方提供的API编写前台页面就可以了,下面提供一个layui.form验证的例子。<!DOCTYPE ...
  • 理解layui表单验证

    2019-09-26 23:40:50
    首先确保验证的字段都在一个表单中, <form class="layui-form-item layui-form" id="mainform"> <div class="layui-form-item"> <div class="layui-inline...
  • 文章目录前言一、layui前端验证二、使用步骤1.以下介绍几个常用的前端验证2.读入数据总结 前言 layui前端框架是一款比较流行的前端框架,多模块集成的UI框架 组件丰富且轻盈 一、layui前端验证 layui的前端验证的...
  • layui表单验证规则

    2021-01-18 11:08:44
    layui,input验收只能输入 整数,小数 <input type='text' onkeyup="value=value.replace(/^(0+)|[^\d.]+/g,'')" name="gift_price" id="gift_price" placeholder="产品价格" autocomplete="off" class="layui-...
  • layui验证规则

    2018-12-25 16:44:00
    layui表单元素的校验只需在元素上加入lay-verify <input type="text" id="a" name="a" placeholder="A" lay-verify="required|number" class="layui-input">...phone(手机号) email(邮箱)...
  • layui发送手机验证码

    千次阅读 2017-11-12 01:31:00
    "__PUBLIC__/layui/css/layui.css" >   < link   rel = "stylesheet"   href = "__PUBLIC__/res/css/global.css" > head > < body >   < include   file = "Common/head"   /> ...
  • layui自定义正则验证

    千次阅读 2019-05-23 11:49:10
    //自定义验证规则 layui.use(['form', 'layedit', 'laydate'], function(){ var form = layui.form form.verify({ guhua: [ /^((0\d{2,3})-)(\d{6,8})?$/ ,'固定电话xxxx-6到8位' ...
  • layui-v2.4.5 的form表单只能通过submit来验证规则,即lay-verify=“required” 的值。 将以下代码复制进form.js中即可 u.prototype.VerifyForm = function(z) { var e = null, a = f.config.verify, s = "layui-...
  • var mobile = /^1[3|4|5|7|8]\d{9}$/, phone = /^0\d{2,3}-?\d{7,8}$/; form.verify({ tellphone: function (value) { var flag = mobile.test(value) || ...flag) { return '请输入正确座机号码或手机号'; } } });
  • 在网上看到很多validform和layer配合的验证方式,但是觉得写的不好,不清不楚的,于是研究了一下layui原生的验证 1. 在需要验证的item上加 lay-verify=“value” ,在提交按钮上加 lay-submit lay-filter=“go” 两...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 823
精华内容 329
关键字:

layui验证手机