<input type="password" id="password" placeholder="請填寫登入密碼">

<span id="passwordAlert"></span>

<script>

var regs = {
    pwdReg: /^.{6,20}$/,
    numReg: /\d/,
    strReg: /[a-zA-Z]/,
    tsReg: /[^\u4e00-\u9fa5a-zA-Z0-9]/
};

$("#password").blur(function () {
    var password = $("#password").val
 
();
    if (password != null && password != "") {
        stripscript(4);
    } else {
        $("#password").css("border-color", "red");
    }
});
$("#password").focus(function () {
    $("#password").css("border-color", "#d5d5d5");
});

function stripscript(s) {

var password = $("#password"
 
).val();

if (regs.pwdReg.test(password)) {

    var level = getPwdLevel(password);

    switch (level) {

        case 1:

            $("#passwordAlert").text("弱");

            $("#passwordAlert").css("color", "red");

            $("#passwordAlert").css("font-weight", "bold");

            break;

        case 
 
2:

            $("#passwordAlert").text("中");

            $("#passwordAlert").css("color", "#f6c12a");

            $("#passwordAlert").css("font-weight", "bold");

            break;

        case 3:

            $("#passwordAlert").text("強");

            $("#passwordAlert").css("color", "green");

            $("#passwordAlert").css("font-weight", "bold");

            break;

    }

}else{

    $("#passwordAlert").text("請輸入6位及以上密碼!");

    $("#passwordAlert").css("color", "red");

    $("#passwordAlert").css("font-weight", "bold");

}

}

function getPwdLevel(pwd) {
    var level = 0;
    var numReg = true, strReg = true, tsReg = true;
    for (var i = 0; i < pwd.length; i++) {
        if (numReg && regs.numReg.test(pwd[i])) {
            level++;
            numReg = false;
            continue;
        }
        if (strReg && regs.strReg.test(pwd[i])) {
            level++;
            strReg = false;
            continue;
        }
        if (tsReg && regs.tsReg.test(pwd[i])) {
            level++;
            tsReg = false;
        }
    }
    return level;
}

</script>