Question

我有一个使用Twitter Bootstrap框架设计的简单登录表单，如下所示：

<form class="form-signin" role="form" action="index.php" method="post" id="login">
 <h2 class="form-signin-heading">Please Log in</h2>
 <input type="text" name="username" class="form-control" placeholder="Account Name" required autofocus>
 <input type="password" name="password" class="form-control" placeholder="Password" required>
 <button class="btn btn-lg btn-primary btn-block" type="submit">Log in</button>
 </form>

我正在使用jQuery Validation插件来验证在提交表单之前已输入用户名/密码字段 - 这很有效。

<script>
    $(document).ready(function () {
   // initialize the plugin
   $("#login").validate();
   });
</script>

我想通过使错误文本（“此字段是必需的”）以红色显示并且相关的表单字段具有红色边框来利用Bootstrap验证状态。我不知道如何添加

.has-error

样式到适当的元素？

Answer 1

尝试：

$("#login").validate({
    errorClass: "has-error"
});

Twitter Bootstrap表单验证 - 使用jQuery Validation Plugin使用验证状态

1 个答案: