layui lay-verify form表单自定义验证规则详解


Posted in Javascript onSeptember 18, 2019

官方文档详见:https://www.layui.com/doc/modules/form.html#verify

虽然layui的官方文档已经是写的比较详细,但是初次使用的时候总会懵一下,这里纪录一下lay-verify自定义验证规则的时候到底放哪。

html:

<input type="text" lay-verify="digital" placeholder="请输入数字">
<button type="button" class="layui-btn layui-btn-norma" lay-submit lay-filter="submit_button">提交</button>

js:

form.verify({
 //数组的两个值分别代表:[正则匹配、匹配不符时的提示文字]
 ,digital: [
  /^[0-4]*$/
 ,'请填入0-4的分数'
 ] 
});

这样写没问题,但是form.verify放置的位置没讲清楚,还是要自己试一下。

layui.use(['form'], function () {
  var form = layui.form;
  //要放在form.on外面,千万不能放在提交步骤中,否则会不触发
  form.verify({
   //数组的两个值分别代表:[正则匹配、匹配不符时的提示文字]
   digital: [
    /^[0-4]*$/
    ,'请填入0-4的分数'
   ]
  });
  form.on("submit(submit_button)", function (data) {
   return false;
  });
 });

以上这篇layui lay-verify form表单自定义验证规则详解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
IE6下opacity与JQuery的奇妙结合
Mar 01 Javascript
自己编写的类似JS的trim方法
Oct 09 Javascript
JavaScript中最简洁的编码html字符串的方法
Oct 11 Javascript
zepto.js中tap事件阻止冒泡的实现方法
Feb 12 Javascript
借助node实战JSONP跨域实例
Mar 30 Javascript
angular.js4使用 RxJS 处理多个 Http 请求
Sep 23 Javascript
express如何使用session与cookie的方法
Jan 30 Javascript
浅谈AngularJS中$http服务的简单用法
May 15 Javascript
在vue中高德地图引入和轨迹的绘制的实现
Oct 11 Javascript
JavaScript实现图片轮播特效
Oct 23 Javascript
jQuery实现雪花飘落效果
Aug 02 jQuery
vue 授权获取微信openId操作
Nov 13 Javascript
layui输入框只允许输入中文且判断长度的例子
Sep 18 #Javascript
Vue Components 数字键盘的实现
Sep 18 #Javascript
layui输入框中只允许输入整数的实现方法
Sep 18 #Javascript
layui富文本编辑器前端无法取值的解决方法
Sep 18 #Javascript
使用layui 的layedit定义自己的toolbar方法
Sep 18 #Javascript
Typescript的三种运行方式(小结)
Sep 18 #Javascript
微信小程序授权登陆及每次检查是否授权实例代码
Sep 18 #Javascript
You might like
关于拼配咖啡,你要知道
2021/03/03 咖啡文化
繁体中文转换为简体中文的PHP函数
2006/10/09 PHP
说说PHP的autoLoad自动加载机制
2012/09/27 PHP
thinkphp实现图片上传功能
2016/01/13 PHP
PHP开发中常用的十个代码样例
2016/02/02 PHP
JavaScript 不只是脚本
2007/05/30 Javascript
仿校内登陆框,精美,给那些很厉害但是没有设计天才的程序员
2008/11/24 Javascript
js DataSet数据源处理代码
2010/03/29 Javascript
基于Jquery实现的一个图片滚动切换
2012/06/21 Javascript
jQuery实现的一个自定义Placeholder属性插件
2014/08/11 Javascript
判断在css加载完毕后执行后续代码示例
2014/09/03 Javascript
JavaScript在Android的WebView中parseInt函数转换不正确问题解决方法
2015/04/25 Javascript
jQuery.each使用详解
2015/07/07 Javascript
Bootstrap按钮下拉菜单组件详解
2016/05/10 Javascript
noty ? jQuery通知插件全面解析
2016/05/18 Javascript
javascript弹出带文字信息的提示框效果
2016/07/19 Javascript
js实现省份下拉菜单效果
2017/02/15 Javascript
js实现1,2,3,5数字按照概率生成
2017/09/12 Javascript
JS端基于download.js实现图片、视频时直接下载而不是打开预览
2020/05/09 Javascript
[19:15]DK战队纪录片
2014/09/02 DOTA
各种Python库安装包下载地址与安装过程详细介绍(Windows版)
2016/11/02 Python
Python判断两个对象相等的原理
2017/12/12 Python
美国家具网站:Cymax
2016/09/17 全球购物
乌克兰数字设备、配件和智能技术的连锁商店:KTC
2020/08/18 全球购物
偷看我的初中毕业鉴定
2014/01/29 职场文书
爱情保证书范文
2014/02/01 职场文书
科研课题实施方案
2014/03/18 职场文书
党的群众路线教育学习材料
2014/05/12 职场文书
小学优秀班干部事迹材料
2014/05/25 职场文书
2014办公室年度工作总结
2014/12/09 职场文书
冬季作息时间调整通知
2015/04/24 职场文书
加薪申请书应该这样写!
2019/07/04 职场文书
python删除csv文件的行列
2021/04/06 Python
浅谈PostgreSQL表分区的三种方式
2021/06/29 PostgreSQL
详解Python+OpenCV绘制灰度直方图
2022/03/22 Python
element tree树形组件回显数据问题解决
2022/08/14 Javascript