html代码

<form id="login-form" method="post">
												<fieldset>
													<label class="block clearfix">
														<span class="block input-icon input-icon-right">
															<input type="text" name="user" class="form-control" placeholder="用户名" />
															<i class="icon-user"></i>
														</span>
													</label>

													<label class="block clearfix">
														<span class="block input-icon input-icon-right">
															<input type="password" name="password" class="form-control" placeholder="密码" />
															<i class="icon-lock"></i>
														</span>
													</label>
                                                    
                                                    <label class="block clearfix">
                                						<input type="text" name="code" id="code" class="span4 form-control" placeholder="验证码" /> <img title="验证码" id="verify_code" src="<{$basepath}>admin/login/code" style="vertical-align:top">
                                					</label>
                                                    
													<div class="space"></div>

													<div class="clearfix">
														<label class="inline">
															<input type="checkbox" class="ace" />
															<span class="lbl"> 一周内免登陆</span>
														</label>

														<button type="submit" class="width-35 pull-right btn btn-sm btn-primary">
															<i class="icon-key"></i>
															登陆
														</button>
													</div>

													<div class="space-4"></div>
												</fieldset>
											</form>

js验证代码

$('#login-form').validate({
        					errorElement: 'div',
        					errorClass: 'help-block',
        					focusInvalid: false,
        					rules: {
        						user: {
        							required: true
        						},
        						password: {
        							required: true
        						},
        						code: {
        							required: true
        						}
        					},
        					invalidHandler: function (event, validator) { //display error alert on form submit   
        						
        					},
        			
        					highlight: function (e) {
        						$(e).closest('label').removeClass('has-info').addClass('has-error');
        					},
        			
        					success: function (label,e) {
        						$(e).closest('label').removeClass('has-error').addClass('has-info');
        					},
                            errorPlacement: function (error, element) {
        						
        					},
        					submitHandler: function (form) {
        					},
        					invalidHandler: function (form) {
        					}
        				});

html代码中没有什么特别说明,主要是js中的highlight实现高亮,而屏蔽提示信息,写了一个空的errorPlacement。

success中用于移除高亮,其中注意它的两个参数,官方文档上说明了是两个文档,但是没有示例。

如上js代码,e返回的是提示信息的标签,如果屏蔽了,继续用e来作为选择器的基础就会出错。