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 相关文章推荐
Javascript的IE和Firefox兼容性汇编
Jul 01 Javascript
jquery 的 $(&quot;#id&quot;).html() 无内容的解决方法
Jun 07 Javascript
javascript 基础篇3 类,回调函数,内置对象,事件处理
Mar 14 Javascript
原生Js实现元素渐隐/渐现(原理为修改元素的css透明度)
Jun 24 Javascript
jQuery中选择器小问题(新人难免遇到)
Mar 31 Javascript
javascript 模拟坦克大战游戏(html5版)附源码下载
Apr 08 Javascript
使用jsonp完美解决跨域问题
Nov 27 Javascript
微信小程序 Canvas增强组件实例详解及源码分享
Jan 04 Javascript
vue 路由页面之间实现用手指进行滑动的方法
Feb 23 Javascript
bootstrap 路径导航 分页 进度条的实例代码
Aug 06 Javascript
JS html事件冒泡和事件捕获操作示例
May 01 Javascript
javascript实现的时间格式加8小时功能示例
Jun 13 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
PHP 解决session死锁的方法
2013/06/20 PHP
php微信高级接口调用方法(自定义菜单接口、客服接口、二维码)
2016/11/28 PHP
php array_reverse 以相反的顺序返回数组实例代码
2017/04/11 PHP
php str_replace替换指定次数的方法详解
2017/05/05 PHP
thinkPHP实现基于ajax的评论回复功能
2018/06/22 PHP
通过js简单实现将一个文本内容转译成加密文本
2013/10/22 Javascript
jquery如何根据值设置默认的选中项
2014/03/17 Javascript
jQuery获取页面及个元素高度、宽度的总结——超实用
2015/07/28 Javascript
jQuery实现元素拖拽并cookie保存顺序的方法
2016/02/20 Javascript
Angular2 环境配置详细介绍
2016/09/21 Javascript
jQuery插件FusionCharts实现的MSBar2D图效果示例【附demo源码】
2017/03/24 jQuery
js canvas实现QQ拨打电话特效
2017/05/10 Javascript
js字符串与Unicode编码互相转换
2017/05/17 Javascript
Vue 动态添加路由及生成菜单的方法示例
2019/06/20 Javascript
js实现一个简易计算器
2020/03/30 Javascript
Cordova(ionic)项目实现双击返回键退出应用
2019/09/17 Javascript
微信小程序地图实现展示线路
2020/07/29 Javascript
zbar解码二维码和条形码示例
2014/02/07 Python
wxPython窗口中文乱码解决方法
2014/10/11 Python
Python 列表排序方法reverse、sort、sorted详解
2016/01/22 Python
Python 基础教程之闭包的使用方法
2017/09/29 Python
Python测试人员需要掌握的知识
2018/02/08 Python
python 字典中文key处理,读取,比较方法
2018/07/06 Python
Python图像处理之图像的读取、显示与保存操作【测试可用】
2019/01/04 Python
python的pytest框架之命令行参数详解(上)
2019/06/27 Python
几款Python编译器比较与推荐(小结)
2020/10/15 Python
中国旅游网站:途牛旅游网
2019/09/29 全球购物
印度第一网上礼品店:IGP.com
2020/02/06 全球购物
澳大利亚厨房和家用电器购物网站:Bing Lee
2021/01/11 全球购物
省级优秀班集体申报材料
2014/05/25 职场文书
2015年学校关工委工作总结
2015/04/03 职场文书
培训计划通知
2015/07/15 职场文书
创业计划书之养殖业
2019/10/11 职场文书
Nginx已编译的nginx-添加新模块
2021/04/01 Servers
pytorch--之halfTensor的使用详解
2021/05/24 Python
React配置子路由的实现
2021/06/03 Javascript