jQuery Bootstrap 密码表不工作

Question

我正在尝试使用 Twitter Bootstrap 的 jQuery 插件，它提供了用于直观显示用户输入密码质量的规则集。

但我的问题是，当我尝试在我的项目中使用它时，它似乎无法正常工作。文本显示相应，但仪表条不工作..

这是我的 HTML -

<form class="form-horizontal">
  <div class="form-group">
    <label for="username" class="col-sm-3 control-label">username</label>
    <div class="col-sm-5">
      <input type="text" class="form-control" id="username" placeholder="Username">
    </div>
  </div>
  <div class="form-group">
    <label for="password" class="col-sm-3 control-label">Password</label>
    <div class="col-sm-5">
      <input type="password" class="form-control" id="password" placeholder="Password">
    </div>
  </div>  <div class="form-group">
    <label for="strenth" class="col-sm-3 control-label">Strenth</label>
    <div class="col-sm-5">
      <!-- <div id="messages"></div> -->
    </div>
  </div>

  <div class="form-group">
    <div class="col-sm-offset-3 col-sm-5">
      <button type="submit" class="btn btn-default">Sign in</button>
    </div>
  </div>
  </form>

我的jQuery-

jQuery(document).ready(function () {
  var options = {
    onLoad: function () {
      $('#messages').text('Start typing password');
    },
    onKeyUp: function (evt) {
      $(evt.target).pwstrength("outputErrorList");
    }
  };
  $(':password').pwstrength(options);
});

这是一个JSBIN，包含我目前所有的代码

希望有人能帮帮我.. 谢谢你。

Answer 1

将您的 css 路径替换为 http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css 在 head 标签中

Check updated JSBIN here

jQuery Bootstrap 密码表不工作

jQuery Bootstrap Password Meter is not working

javascript

css

jquery

twitter-bootstrap