最近layui的表单用的比较多,所以整理来一下自定义的验证如下(下面是自己写的例子):
layui的官网
引入layui之后
html
<form action="" class="layui-form"><!-- 表单 --><div class="login_from data_felx flex-diry"><div class="span flex-bet data_felx"><span>Email address</span></div><input type="text" name="title" lay-verify="title" autocomplete="off" class="layui-input"></div><!-- 表单 --><div class="login_from data_felx flex-diry"><div class="span flex-align flex-bet"><span>Password</span><span>Forgot password?</span></div><input type="text" name="title" lay-verify="pass" autocomplete="off" class="layui-input"></div><!-- 按钮 --><button class="layui-btn login_button" lay-submit lay-filter="formDemo">SIGN IN</button></form>
script 两种方式都可以
layui.use(['jquery', 'form', 'layer'], function () {var $ = layui.jquery;var layer = layui.layer;var form = layui.form;//自定义验证规则form.verify({title: function (value) {if (value.length < 1) {return '必须填写字段';}if (!new RegExp("^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$").test(value)) {return '请填写正确的电子邮件地址';}},pass: function (value) {if (value.length < 1) {return '必须填写字段';}if (!new RegExp("^[\S]{6,12}$").test(value)) {return '请填写正确的电子邮件地址';}}, content: function (value) {layedit.sync(editIndex);}});})
数组形式
layui.use(['jquery', 'form', 'layer'], function () {var $ = layui.jquery;var layer = layui.layer;var form = layui.form;//自定义验证规则form.verify({title: [/^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/, '必须填写字段'], pass: [/^[\S]{6,12}$/, '密码必须是6到12位的数字,不能有空格'], content: function (value) {layedit.sync(editIndex);}});})