BootStrapValidator校验方式


Posted in Javascript onDecember 19, 2016

做输入校验的时候如果你前端框架用的是bootstrap的话,首推bootstrapValidator校验方式,具体流程如下:

一、下载,导入js文件

<link type="text/css" rel="stylesheet" href="${ctx}/components/validate/css/bootstrapValidator.css" />
<script type="text/javascript" src="${ctx}/components/validate/js/bootstrapValidator.js"></script>
<script type="text/javascript" src="${ctx}/components/validate/js/language/zh_CN.js"></script>

二、

$(表单id:)({
  message:'这里写默认提示信息';
  feedbackIcons:{
          valid:'glyphicon glyphicon-ok',
          invalid:'glyphicon glyphicon-remove',
          validating:'glyphicon glyphicon-refresh'
        },
   fields: {
            inputName: {
            validators: {
              notEmpty: {
                message: '时间不能为空'
              },
              regexp: {
                 regexp: /^[0-9]+$/ ,
                 message: '时间由数字组成'
               },
                 stringLength: {
                min: 1,
                max: 20,
                message: '角色名长度必须在1到20之间'
              }
          }
      }
   }
   )

网上有各种验证,当然有自定义验证,如上例中的时间由数字组成。

以上所述是小编给大家介绍的BootStrapValidator校验方式,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
从零开始学习jQuery (十一) 实战表单验证与自动完成提示插件
Feb 23 Javascript
jQuery中判断一个元素是否为另一个元素的子元素(或者其本身)
Mar 21 Javascript
jquery实现的图片点击滚动效果
Apr 29 Javascript
javascript实现简单的全选和反选功能
Jan 05 Javascript
Javascript中apply、call、bind的巧妙使用
Aug 18 Javascript
AngularJS中的按需加载ocLazyLoad示例
Jan 11 Javascript
Bootstrap选项卡学习笔记分享
Feb 13 Javascript
vue在使用ECharts时的异步更新和数据加载详解
Nov 22 Javascript
JS实现多物体运动的方法详解
Jan 23 Javascript
Seajs源码详解分析
Apr 02 Javascript
Vue动态面包屑功能的实现方法
Jul 01 Javascript
JS加载解析Markdown文档过程详解
May 19 Javascript
详解js的延迟对象、跨域、模板引擎、弹出层、AJAX【附实例下载】
Dec 19 #Javascript
JavaScript中this的用法实例分析
Dec 19 #Javascript
JS填写银行卡号每隔4位数字加一个空格
Dec 19 #Javascript
JavaScript中校验银行卡号的实现代码
Dec 19 #Javascript
快速入门Vue
Dec 19 #Javascript
javascript中call,apply,bind函数用法示例
Dec 19 #Javascript
谈谈jQuery之Deferred源码剖析
Dec 19 #Javascript
You might like
在DC的漫画和电影中,蝙蝠侠的宿敌,小丑的真名是什么?
2020/04/09 欧美动漫
PHP OPP机制和模式简介(抽象类、接口和契约式编程)
2014/06/09 PHP
PHP文件缓存smarty模板应用实例分析
2016/02/26 PHP
php新建文件的方法实例
2019/09/26 PHP
PHP使用Http Post请求发送Json对象数据代码解析
2020/07/16 PHP
用Javascript同时提交多个Web表单的方法
2009/12/26 Javascript
基于jQuery的360图片展示实现代码
2012/06/14 Javascript
js实现单行文本向上滚动效果实例代码
2013/11/28 Javascript
JavaScript 变量、作用域及内存
2015/04/08 Javascript
JS获取鼠标相对位置的方法
2016/09/20 Javascript
js 递归和定时器的实例解析
2017/02/03 Javascript
Vue中插入HTML代码的方法
2018/09/21 Javascript
Vue使用mixin分发组件的可复用功能
2019/09/01 Javascript
node.js文件操作系统实例详解
2019/11/05 Javascript
[13:55]Newbee vs Team Spirit
2018/06/07 DOTA
python抓取百度首页的方法
2015/05/19 Python
python同时遍历数组的索引和值的实例
2018/11/15 Python
Python面向对象实现一个对象调用另一个对象操作示例
2019/04/08 Python
Python3.5基础之变量、数据结构、条件和循环语句、break与continue语句实例详解
2019/04/26 Python
Python 20行简单实现有道在线翻译的详解
2019/05/15 Python
python能做哪方面的工作
2020/06/15 Python
降低python版本的操作方法
2020/09/11 Python
凯特王妃父母建立的派对用品网站:Party Pieces
2017/05/28 全球购物
台湾百利市购物中心:e-Payless
2017/08/16 全球购物
豪华复古化妆:Besame Cosmetics
2019/09/06 全球购物
社团文化节策划书
2014/02/01 职场文书
党的群众路线学习材料
2014/05/16 职场文书
特教教师先进事迹
2014/05/21 职场文书
2014年文秘工作总结
2014/11/25 职场文书
综治目标管理责任书
2015/05/11 职场文书
2015年语文教研组工作总结
2015/05/23 职场文书
贫困证明书范文
2015/06/16 职场文书
Python控制台输出俄罗斯方块移动和旋转功能
2021/04/18 Python
Python开发工具Pycharm的安装以及使用步骤总结
2021/06/24 Python
浅析Django接口版本控制
2021/06/26 Python
MySQL的表级锁,行级锁,排它锁和共享锁
2022/07/15 MySQL