js密码强度实时检测代码

<div class="vali_pass">
 <h3>简单的密码强度检测</h3>
 <input type="password" name="pass">
 <div class="vali_pass_progress">
  <span class="vali_pass_inner_progress"></span>
 </div>
</div>

.vali_pass {
 width: 350px;
 margin: 0 auto;
 padding: 10px;
 border: #eee 1px solid;
 text-align: center;
}
.vali_pass input {
 width: 96%;
 display: block;
 margin: 0;
 padding: 5px;
 font-size: 14px;
 line-height: 20px;
}
.vali_pass_progress {
 margin-top: 10px;
 background-color: #efefef;
 height: 10px;
 border-radius: 5px;
}
.vali_pass_inner_progress {
 display: block;
 height: 100%;
 background-color: transparent;
 border-radius: 5px;
 width: 100%;
}

.error {
 background-color: #ff3300;
}
.middle {
 background-color: gold;
}
.strong {
 background-color: green;
}

ele_pass.onkeyup = function () {...}

var regxs = [];
regxs.push(/[^a-zA-Z0-9_]/g);
regxs.push(/[a-zA-Z]/g);
regxs.push(/[0-9]/g);

ele_pass.onkeyup = function () {
 var val = this.value;
 var len = val.length;
 var sec = 0;
 if (len >= 6) { // 至少六个字符
  for (var i = 0; i < regxs.length; i++) {
   if (val.match(regxs[i])) {
    sec++;
   }
  }
 }
 var result = (sec / regxs.length) * 100;
 ele_progress.style.width = result + "%";
}

if(result > 0 && result <= 50){
 ele_progress.setAttribute("class",begin_classname + " error");
}else if (result > 50 && result < 100) {
 ele_progress.setAttribute("class",begin_classname + " middle");
} else if (result == 100) {
 ele_progress.setAttribute("class",begin_classname + " strong");
}

var ele_pass = document.getElementsByTagName("input")[0];
var ele_progress = document.getElementsByClassName("vali_pass_inner_progress")[0];
var begin_classname = ele_progress.className;
var regxs = [];
regxs.push(/[^a-zA-Z0-9_]/g);
regxs.push(/[a-zA-Z]/g);
regxs.push(/[0-9]/g);

ele_pass.onkeyup = function () {
 var val = this.value;
 var len = val.length;
 var sec = 0;
 if (len >= 6) { // 至少六个字符
  for (var i = 0; i < regxs.length; i++) {
   if (val.match(regxs[i])) {
    sec++;
   }
  }
 }
 var result = (sec / regxs.length) * 100;
 ele_progress.style.width = result + "%";
 if(result > 0 && result <= 50){
  ele_progress.setAttribute("class",begin_classname + " error");
 }else if (result > 50 && result < 100) {
  ele_progress.setAttribute("class",begin_classname + " middle");
 } else if (result == 100) {
  ele_progress.setAttribute("class",begin_classname + " strong");
 }

}