jquery插件bootstrapValidator表单验证详解

<link rel="stylesheet" type="text/css" href="path/bootstrapValidator.min.css">
<script type="text/javascript" src="path/bootstrapValidator.min.js"></script>

$(document).ready(function() {
 $(formSelector).bootstrapValidator({
 excluded: ...,
 feedbackIcons: ...,
 live: 'enabled',
 message: 'This value is not valid',
 submitButtons: 'button[type="submit"]',
 submitHandler: null,
 trigger: null,
 fields: {
 <fieldName>: {
 enabled: true,
 message: 'This value is not valid',
 container: null,
 selector: null,
 trigger: null,
 // Map the validator name with its options
 validators: {
 ...
 <validatorName>: <validatorOptions>
 ...
 }
 }
 ...
 }
 });
});

<form id="logForm" class="form-horizontal">
 <div class="form-group">
 <label class="col-lg-3 control-label">用户名</label>
 <div class="col-lg-5">
 <input type="text" class="form-control" name="username" />
 </div>
 </div>
 <div class="form-group">
 <label class="col-lg-3 control-label">邮箱</label>
 <div class="col-lg-5">
 <input type="text" class="form-control" name="email" />
 </div>
 </div>
 <div class="form-group">
 <label class="col-lg-3 control-label">密码</label>
 <div class="col-lg-5">
 <input type="password" class="form-control" name="password" />
 </div>
 </div>
 <button type="submit" class="btn btn-md">提交</button>
</form>

$(document).ready(function() {
 $('#signup-form').bootstrapValidator({
 fields: {
 username: {
 validators: {
 notEmpty: {
 message: '用户名不能为空'
 },
 stringLength: {
 min: 3,
 max: 6,
 message: '用户名只能在3-6个字符之间哦~'
 }
 }
 },
 email: {
 validators: {
 emailAddress: {
 message: '邮箱格式有误'
 }
 }
 },
 password: {
 validators: {
 notEmpty: {
 message: '密码不能为空'
 },
 stringLength: {
 min: 6,
 max: 8,
 message: '密码必须在6-8个字符之间~'
 },
 regexp: {
 regexp: /^[a-zA-Z0-9]+$/,
 message: '密码只能由字母、数字组成~'
 }
 }
 }
 }
 });
}); 

<form class="form-horizontal">
 <div class="form-group">
 <label class="col-lg-3 control-label">用户名</label>
 <div class="col-lg-5">
 <input type="text" id="user" class="form-control" name="login_user.userName" />
 </div>
 </div>
 <div class="form-group">
 <label class="col-lg-3 control-label">密码</label>
 <div class="col-lg-5">
 <input type="password" id="pass" class="form-control" name="login_user.password" />
 </div>
 </div>
 <button type="submit" id="submitBtn" class="btn btn-md">提交</button>
</form>

$(document).ready(function() {
 $('#signup-form').bootstrapValidator({
 fields: {
 user: {
 selector: '#user', 
 validators: {
 notEmpty: {
 message: '用户名不能为空'
 },
 stringLength: {
 min: 3,
 max: 6,
 message: '用户名只能在3-6个字符之间哦~'
 }
 }
 },
 pass: {
 selector: '#pass',
 validators: {
 notEmpty: {
 message: '密码不能为空'
 },
 stringLength: {
 min: 6,
 max: 8,
 message: '密码必须在6-8个字符之间~'
 },
 regexp: {
 regexp: /^[a-zA-Z0-9]+$/,
 message: '密码只能由字母、数字组成~'
 }
 }
 }
 }
 });
});