BootstrapValidator验证表单用法

引入文件

<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/