引入文件

<link rel="stylesheet" href="css/bootstrap.css"/>
<link rel="stylesheet" href="css/bootstrapValidator.min.css"/> <script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script> <script type="text/javascript" src="js/bootstrapValidator.min.js"></script>

html

<form form=“testForm” role="form">
<div class="form-group">
<label>用户名</label>
<input type="text" class="form-control" name="username" />
</div>
<div class="form-group">
<label>Email</label>
<input type="text" class="form-control" name="email" />
</div>
</form>

js

    $(#testForm).bootstrapValidator({
message: 'This value is not valid',
feedbackIcons: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
username: {
message: '用户名输入格式不正确',
validators: {
notEmpty: {
message: '用户名不能为空'
},
stringLength: {
min: 6,
max: 18,
message: '用户名在6-18字之内'
},
regexp: {
regexp: /^[a-zA-Z0-9_]+$/,
message: '输入数字与字母组合'
}
}
},
email: {
validators: {
notEmpty: {
message: '不能为空'
},
emailAddress: {
message: '请输入正确的邮箱地址'
}
}
}
}
});

jQuery API:http://bv.doc.javake.cn/examples/

BootstrapValidator验证表单用法的更多相关文章

  1. bootstrapValidator验证表单后清除当次验证的方法

    用bootstrapValidator的resetForm()方法: <!-- // create server begin --> <div class="modal f ...

  2. 运用jQuery写的验证表单

    //运用jQuery写的验证表单 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...

  3. tp框架之自动验证表单

    tp框架的create自动加载表单的方法可以自动根据自己定义的要求来验证表单里面的内容,但是由于是在后台执行代码,会拖慢程序运行速度,所以还是建议通过前端js来进行判断,后台只进行数据库的查询以及传值 ...

  4. jquery.validate 使用--验证表单隐藏域

    jQuery validate很不错的一个jQuery表单验证插件.升级到了1.9版的后,发现隐藏表单域验证全部失效,特别是在jquery.ui.tabs.min.js构造的Tabs里的验证. 是因为 ...

  5. ajax验证表单元素规范正确与否 ajax展示加载数据库数据 ajax三级联动

    一.ajax验证表单元素规范正确与否 以用ajax来验证用户名是否被占用为例 1创建表单元素<input type="text" id="t"> 2 ...

  6. js验证表单大全

    js验证表单大全 1. 长度限制 <script> function test() { if(document.a.b.value.length>50) { alert(" ...

  7. MVC4中 jquery validate 不用submit方式验证表单或单个元素

    正确引入MVC4 jquery验证的相关文件 <script src="/Scripts/jquery-1.4.4.js"></script> <sc ...

  8. 开始使用HTML5和CSS3验证表单

    使用HTML5和CSS3验证表单 客户端验证是网页客户端程序最常用的功能之一,我们之前使用了各种各样的js库来进行表单的验证.HTML5其实早已为我们提供了表单验证的功能.至于为啥没有流行起来估计是兼 ...

  9. MVC中 jquery validate 不用submit方式验证表单或单个元素

    <script src="/Scripts/jquery-1.4.4.js"></script> <script src="/Scripts ...

随机推荐

  1. linux性能测试命令-----top

    Top命令显示了实际CPU使用情况,默认情况下,它显示了服务器上占用CPU的任务信息,并且每5秒钟刷新一次.它会显示CPU使用量.内存使用量.交换内存.缓存大小.缓冲区大小.流程PID.用户.命令等. ...

  2. hessian 协议

    什么是Hessian协议呢? 目前,Web服务技术是解决异构平台系统的集成及互操作问题的主流技术. 它所基于的XML已经是Internet上交换数据的实际标准,基于通用的进程间通信协议和网络传输协议屏 ...

  3. Druid.io索引过程分析——时间窗,列存储,LSM树,充分利用内存,concise压缩

    Druid底层不保存原始数据,而是借鉴了Apache Lucene.Apache Solr以及ElasticSearch等检索引擎的基本做法,对数据按列建立索引,最终转化为Segment,用于存储.查 ...

  4. Windows Store App 主题动画

    Windows 8系统的动画库中包含了丰富的主题动画,在开发Windows应用商店应用时,使用主题动画编写较少的代码即可实现所期望的动画效果.下面介绍一些常用的主题动画,读者可以根据每种主题动画提供的 ...

  5. 0506--Scrum项目1.0

    应用NABCD模型,分析你们初步选定的项目,充分说明你们选题的理由. 录制为演说视频,上传到视频网站,并把链接发到团队博客上. 团队项目选题  四则运算 NABCD 模型 1) N (Need 需求) ...

  6. DataTable 导到Excel

    /// <summary> /// 将DataTalbe导出到Excel中 /// </summary> /// <param name="dt"&g ...

  7. TreeSet和Comparator 对TreeSet排序

    使用TreeSet和Comparator,编写TreeSetTestInner类,要求对TreeSet中的元素"HashSet"."ArrayList".&qu ...

  8. Appium移动自动化测试(一)--安装Appium

    Appium 自动化测试是很早之前就想学习和研究的技术了,可是一直抽不出一块完整的时间来做这件事儿.现在终于有了. 反观各种互联网的招聘移动测试成了主流,如果再不去学习移动自动化测试技术将会被淘汰. ...

  9. 【0 - 1】OC内存管理

    一.内存管理概述 垃圾回收机制(GC):由系统管理内存,程序员不需要管理. OC中的垃圾回收:在OC2.0版加入垃圾回收. OC与iOS:OC有垃圾回收机制,但是iOS屏蔽了这个功能.原因:iOS运行 ...

  10. Rhel6-vpn配置文档

    系统环境: rhel6 x86_64 iptables and selinux disabled 主机: 192.168.122.160 server60.example.com 192.168.12 ...