我们再开发带有注册功能的网站时,会要求用户自己设置密码,网站会根据输入密码的字符特点给出相应的密码强度提示,比如密码过段、密码强度差、密码强度中等、密码强度强等。

jquery实现方式如下:

Html代码:


  <input type="password" name="password" id="password" />
  < span id="pwdstrength">< /span>

jquery代码:


 $('#password').keyup(function(e) {
    //密码为八位及以上并且字母数字特殊字符三项都包括
    var strongRegex = new RegExp("^(?=.{8,})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\\W).*$", "g");
    //密码为七位及以上并且字母、数字、特殊字符三项中有两项,强度是中等
    var mediumRegex = new RegExp("^(?=.{7,})(((?=.*[A-Z])(?=.*[a-z]))|((?=.*[A-Z])(?=.*[0-9]))|((?=.*[a-z])(?=.*[0-9]))).*$", "g");
    var enoughRegex = new RegExp("(?=.{6,}).*", "g");
    if (false == enoughRegex.test($(this).val())) {
        $('#pwdstrength').html('密码太短!');
    } else if (strongRegex.test($(this).val())) {
        $('#pwdstrength').className = 'ok';
        $('#pwdstrength').html('强度强!');
    } else if (mediumRegex.test($(this).val())) {
        $('#pwdstrength').className = 'alert';
        $('#pwdstrength').html('强度中等!');
    } else {
        $('#pwdstrength').className = 'error';
        $('#pwdstrength').html('强度弱!');
    }
        return true;
});