### 一、引入css和js文件 ```javascript ``` ### 二、使用方式 1. 在使用bootstrapValidator对某个字段添加验证规则的时候，需要

包裹，input标签必须要有name值，此值为验证匹配的字段。 2. input 使用添加 maxLength 后，stringLength 不生效 #### 2.1 html+js+button提交 ```javascript ``` ```javascript $(function () { // 修改用户信息 $("#updateUserInfoBtn").click(function () { $("#updateUserInfoForm").bootstrapValidator("validate"); }); }) // 修改用户信息 $("#updateUserInfoForm").bootstrapValidator({ message: "This value is not valid", fields: { nickname: { verbose: false, validators: { notEmpty: { message: "昵称不能为空" }, stringLength: { max: 63, message: "昵称不超过63个字符" } } } } }).on("success.form.bv", function (e) { e.preventDefault(); var $form = $(e.target); // 接口提交 }); ``` #### 2.2 html+js+submit提交 ```javascript ``` ```javascript // 修改用户信息 $("#updateUserInfoForm").bootstrapValidator({ message: "This value is not valid", fields: { nickname: { verbose: false, validators: { notEmpty: { message: "昵称不能为空" }, stringLength: { max: 63, message: "昵称不超过63个字符" } } } } }).on("success.form.bv", function (e) { e.preventDefault(); var $form = $(e.target); // 接口提交 }); ``` #### 2.3 纯html+js+button提交 ```javascript ``` ```javascript $(function () { // 修改用户信息 $("#updateUserInfoBtn").click(function () { $("#updateUserInfoForm").bootstrapValidator("validate"); }); }) ``` ### 三、常用验证 - 验证字段是否为空 ```javascript notEmpty: { message: '必填不能为空' } ``` - 验证字段长度 ```javascript stringLength: { min: 6, max: 30, message: '长度不能小于6位或超过30位' } ``` - 正则表达式进行验证 ```javascript regexp: { regexp: /^[A-Z\s]+$/i, message: '只能由字母字符和空格组成。' } ``` - 大小写验证 ```javascript stringCase: { message: '必须只包含大写字符。', case: 'upper'//其他值或不填表示只能小写字符 } ``` - 两个字段不相同的判断 ```javascript different: { field: 'password', message: '用户名和密码不能相同。' } ``` - email验证 ```javascript emailAddress: { message: 'email无效' } ``` - 日期格式验证 ```javascript date: { format: 'YYYY/MM/DD', message: '日期无效' } ``` - 整数验证 ```javascript digits: { message: '该值只能包含整数。' } ``` - 浮点数和整数验证 ```javascript number: { message: '该值只能包含数字。' } ``` - 复选框验证 ```javascript choice: { min: 2, max: 4, message: '请选择2-4项' } ``` - 密码确认 ```javascript identical: { field: 'confirmPassword', message: '两次密码必须输入一致' } ``` - 判断输入数字是否符合大于18小于100 ```javascript greaterThan: { value: 18 }, lessThan: { value: 100 } ``` - uri验证 ```javascript uri: {} ``` - ajax验证 ```javascript threshold: 6, remote: { url: 'api/checkUsername', message: '该用户名已经存在！', delay: 2000, type: 'post' } ``` threshold：有6字符以上才发送ajax请求，（input中输入一个字符，插件会向服务器发送一次，设置限制，6字符以上才开始） remote：server result:{“valid”,true or false} 向服务发送当前input name值，获得一个json数据。例表示正确：{“valid”,true} delay：每输入一个字符，就发ajax请求，服务器压力还是太大，设置2秒发送一次ajax（默认输入一个字符，提交一次，服务器压力太大） type：请求方式

他的文章