layui框架实战案例(11):表单自定义验证规则

简介: layui框架实战案例(11):表单自定义验证规则

验证代码lay-verify=“user_agree”

            <div class="layui-form-item">
                <label for="user_phone" class="layui-form-label" style="width: 20%;"></label>
                <div class="layui-input-inline">
                    <input type="radio" id="user_agree" name="user_agree" value="1" lay-skin="primary" lay-verify="user_agree" title="我已经阅读并接受">
                </div>
                <div class="layui-form-mid layui-word-aux" style="margin-left: -50px;"><a href="index.php?m=Pop&a=privacy" target="_blank">《隐私政策》</a> <a href="index.php?m=Pop&a=agreement" target="_blank">《用户协议》</a><a href="index.php?m=Pop&a=sensitive" target="_blank">《敏感个人信息授权书》</a></div>
            </div>


验证函数

        //自定义验证规则
        form.verify({
            user_card: [/(^\d{15}$)|(^\d{17}(x|X|\d)$)/, "请输入正确的18位身份证号"]
            , user_phone: [/^1[3|4|5|6|7|8|9]\d{9}$/, '手机必须11位,只能是数字!']
            , smscode: [/^\d{6}$/, "验证码为6位数且5分钟内有效"]
            , pass: [/(.+){6,12}$/, '密码必须6到12位']
            , user_agree: function () {
                if ($('input[name="user_agree"]:checked').val() != 1) {
                    return '必须通过服务条款《隐私政策》、《用户协议》 、《敏感个人信息授权书》';
                }
            }
            , repass: function () {
                if ($('#L_pass').val() != $('#L_repass').val()) {
                    return '两次密码不一致';
                }
            }
        });


@lockdata.cn

相关文章
|
前端开发 网络安全
layui如何实现添加数据时关闭页面层,并实时刷新表格数据?
layui如何实现添加数据时关闭页面层,并实时刷新表格数据?
|
前端开发 小程序
微信小程序canvas画布绘制base64图片并保存图片到相册中
微信小程序canvas画布绘制base64图片并保存图片到相册中
671 0
|
数据格式
Layui中table数据表格使用方法渲染 返回的数据不符合规范,正确的成功状态码应为:“code“: 0异常处理
Layui中table数据表格使用方法渲染 返回的数据不符合规范,正确的成功状态码应为:“code“: 0异常处理
2093 0
|
SQL
SQL语句计算经纬度距离
SQL语句计算经纬度距离
1313 117
|
JavaScript 前端开发 开发者
Layui layer 弹出层的使用【笔记】
本文介绍了Layui的layer弹出层组件的使用方法,包括如何通过在线CDN引入Layui的CSS和JS文件,以及如何使用layer.open(options)开启弹出层和layer.close(index)关闭弹出层。文章详细说明了弹出层类型的分类、options选项的参数配置,以及回调函数的使用。通过示例代码,展示了如何创建不同类型的弹出层,包括对话信息框、页面层、内联框架层、加载层和tips层。
|
缓存 安全 数据库
防重放攻击实现
防重放攻击实现
1088 5
|
JavaScript API
Vue中使用require.context()自动引入组件和自动生成路由的方法介绍
Vue中使用require.context()自动引入组件和自动生成路由的方法介绍
697 0
|
编解码 JavaScript
【vue2】vue2 适配pc端,解决浏览器缩放问题,解决电脑显示设置缩放、分辨率问题
【vue2】vue2 适配pc端,解决浏览器缩放问题,解决电脑显示设置缩放、分辨率问题
2289 1
|
前端开发
layui-form
`layui-form`是一个前端表单组件,提供多种表单类型如单行、多行排列的输入框,下拉选择框(支持模糊搜索),单选框和复选框。表单元素可通过`required`和`lay-verify`属性进行必填和验证设置。编辑器如`layedit`可用于富文本输入,表单监听事件如提交和单选器可绑定回调函数进行处理。此外,能动态更新渲染表单,初始化表单数据并进行数据校验,包括自定义验证规则。
1121 1