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 相关文章推荐
浅析jQuery对select操作小结(遍历option,操作option)
Jul 04 Javascript
jquery如何根据值设置默认的选中项
Mar 17 Javascript
JavaScript中使用指数方法Math.exp()的简介
Jun 15 Javascript
不想让浏览器运行javascript脚本的方法
Nov 20 Javascript
JS变量及其作用域
Mar 29 Javascript
Bootstrap弹出框(Popover)被挤压的问题小结
Jul 11 Javascript
Vue响应式原理Observer、Dep、Watcher理解
Jun 06 Javascript
JQuery实现ul中添加LI和删除指定的Li元素功能完整示例
Oct 16 jQuery
JavaScript onclick事件使用方法详解
May 15 Javascript
Vue实现计算器计算效果
Aug 17 Javascript
谈谈JavaScript中的垃圾回收机制
Sep 17 Javascript
微信小程序淘宝首页双排图片布局排版代码(推荐)
Oct 29 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 日期加减的类,很不错
2009/10/10 PHP
php set_magic_quotes_runtime() 函数过时解决方法
2010/07/08 PHP
PHP冒泡排序算法代码详细解读
2011/07/17 PHP
php实例分享之mysql数据备份
2014/05/19 PHP
zend framework框架中url大小写问题解决方法
2014/08/19 PHP
PHP内存缓存Memcached类实例
2014/12/08 PHP
php metaphone()函数及php localeconv() 函数实例解析
2016/05/15 PHP
php静态成员方法和静态的成员属性的使用方法
2017/10/26 PHP
PHP仿tp实现mvc框架基本设计思路与实现方法分析
2018/05/23 PHP
浅谈PHP array_search 和 in_array 函数效率问题
2019/10/15 PHP
在IE上直接编辑网页内容的js代码(IE地址栏js)
2009/04/27 Javascript
js 验证密码强弱的小例子
2013/03/21 Javascript
js将控件隐藏的方法及display属性介绍
2013/07/04 Javascript
angular.bind使用心得
2015/10/26 Javascript
JavaScript+html5 canvas实现图片破碎重组动画特效
2016/02/22 Javascript
bootstrap快速制作后台界面
2016/12/05 Javascript
JS实现发送短信验证后按钮倒计时功能(防止刷新倒计时失效)
2017/07/07 Javascript
详解AngularJS1.x学习directive 中‘&amp; ’‘=’ ‘@’符号的区别使用
2017/08/23 Javascript
原生JS+HTML5实现的可调节写字板功能示例
2018/08/30 Javascript
js中null与空字符串&quot;&quot;的区别讲解
2019/01/17 Javascript
python3文件复制、延迟文件复制任务的实现方法
2019/09/02 Python
Python爬虫爬取煎蛋网图片代码实例
2019/12/16 Python
python-OpenCV 实现将数组转换成灰度图和彩图
2020/01/09 Python
pytorch中的inference使用实例
2020/02/20 Python
Python操控mysql批量插入数据的实现方法
2020/10/27 Python
Pycharm 设置默认解释器路径和编码格式的操作
2021/02/05 Python
美国最大的船只买卖在线市场:Boat Trader
2018/08/04 全球购物
日本必酷网络直营店:Biccamera
2019/03/23 全球购物
施华洛世奇新加坡官网:SWAROVSKI新加坡
2020/10/06 全球购物
Ajax主要包含了哪些技术
2014/06/12 面试题
毕业生就业自荐书
2013/12/15 职场文书
《理想的风筝》教学反思
2014/04/11 职场文书
警察先进个人事迹材料
2014/05/16 职场文书
调研汇报材料范文
2014/08/17 职场文书
教你利用python实现企业微信发送消息
2021/05/23 Python