基本密码强度验证器

Question

我正在尝试创建一个表单，用于检测密码是弱、中还是强。这是由它的长度决定的。

我是新手，对javascript有点困惑，所以我已经启动了脚本，但缺少一些部分。到目前为止，我已经使用if语句生成了一个名为passwordStrength的函数

我们在课堂上一直在研究一个更复杂的表格，所以我一直在复制其中的部分。如有任何帮助，我们将不胜感激：）

这是我的javascript和我的代码链接：

http://jsfiddle.net/xes8p/

var password = document.querySelector ('#password'); 
var submit = document.querySelector ('#submit');
function displayError (fieldname, message) {
 var input_field = document.querySelector('#' + fieldname);
 var error_box = document.querySelector('#'+fieldname+'Message');
}
function hideError(fieldname){
 var input_field = document.querySelector('#'+fieldname);
 var error_box = document.querySelector('#'+fieldname+'Message');
}

function passwordStrength () {
 if(passwordStrength.value <= 4){
displayError('password', 'Weak');
 }else if(passwordStrength.value > 4 && 
passwordStrength.value  <= 6){
displayError('password', 'Medium');
}else if (passwordStrength.value <6){
displayError('password', 'Strong');
}
return passwordStrength;

}

Answer 1

如果长度只是定义的，你可以做这样的事情：

//#区域JS

function passwordStrength() {
    var weak = 6;
   // var medium = 9;
    var strong = 12;
   var message ="Your password is strong";
    var currentPasswordLength = $("#my-password-id").val().length;
    if (currentPasswordLength < weak) {
        message  = "Your password is weak");
    } else if (currentPasswordLength < strong) {
       message = "Your password is medium");
    } 
    $("#my-span-id").text(message );
}
//   $(document).ready(function(){
$("#my-password-id").keyup(passwordStrength);
// });
//#endregion JS
<!-- HTML REGION-->
<input id="my-password-id" type="password" required/>
<span  id="my-span-id"></span>
<!-- HTML ENDREGION-->

FIDLE：http://jsfiddle.net/uet23/