js 判断密码强弱 显示

码强弱的显示 三个档次 弱 中 强 使用这个图片，这个图片分别地位到三个地方，-0px -24px，这是好用sam给我的，学会了  呵呵
是定位到弱的那一行上，中 强都是这么干的

<style type="text/css">
 .w0{
  background:url(<%=basePath%>/front/images/pwbg.png);
  105px;
  height:24px;
  display:none;
 
 }
 .w1{
  background:url(<%=basePath%>/front/images/pwbg.png) -0px -24px;
  105px;
  height:24px;
  display:none;
 
 }
 .w2{
  background:url(<%=basePath%>/front/images/pwbg.png) -0px -48px;
  105px;
  height:24px;
  display:none;
 
 }
 .w3{
  background:url(<%=basePath%>/front/images/pwbg.png) -0px -74px;
  105px;
  height:24px;
  display:none;
 
 }

</style>

下面是密码框 

                 <input name="usersInf.loginPass" id="upass"  onkeyup="checklevel(this.value)" onblur="checkLoginPass1()" maxlength="18"
                      class="asiptinput" type="password" style="250px;"/>
                  <span class="datetime">
                   <span class="txtred"> * </span> 请输入6-18个字母、数字、下划线
                   <span id="pass1" class="txtred"></span>
                   <!-- <div id="pwdisok" style="display: none;330px;"> -->
               <!-- 密码强弱判断 -->
               <span id="pwd_small"  class="w1"> </span>
               <span id="pwd_center" class="w2"> </span>
               <span id="pwd_ok" class="w3"> </span>
           <!-- </div> -->
                  </span>

下面是密码框触发的函数，对输入的密码进行处理，区分开来是那个等级的，并显示

//密码强度
function checkstr(str){
  if(str>=48&&str<=57){//数字
      return 1;
  }else if(str>=65&&str<=90){//大写字母
      return 2;
  }else if(str>=97&&str<=122) {//小写字母
      return 3;
  }else{//特殊字符
      return 4;
  }
}
function checkl(string){
  n=false;
  s=false;
  t=false;
  l_num=0;
  if(string.length<6){
    l_num=1;
  }else{
   for(i=0;i<string.length;i++){
      asc=checkstr(string.charCodeAt(i));
      if(asc==1 && n==false){
        l_num+=1;
        n=true;
      }
      if((asc==2 || asc==3) && s==false){
        l_num+=1;
        s=true;
      }
      if(asc==4 && t==false){
        l_num+=1;
        t=true;
      }
   }
  }
  return l_num;
}

function checklevel(psw){
 if(psw == ""){
      document.getElementByIdx_x_x("pwd_small").style.display="none";
      document.getElementByIdx_x_x("pwd_center").style.display="none";
      document.getElementByIdx_x_x("pwd_ok").style.display="none";
 }else{
      thelev=checkl(psw);
      switch(thelev){
   case 1:
      document.getElementByIdx_x_x("pwd_small").style.display="block";
          document.getElementByIdx_x_x("pwd_center").style.display="none";
          document.getElementByIdx_x_x("pwd_ok").style.display="none";
      break;
   case 2:
      document.getElementByIdx_x_x("pwd_small").style.display="none";
          document.getElementByIdx_x_x("pwd_center").style.display="block";
          document.getElementByIdx_x_x("pwd_ok").style.display="none";
      break;
   case 3:
      document.getElementByIdx_x_x("pwd_small").style.display="none";
          document.getElementByIdx_x_x("pwd_center").style.display="none";
          document.getElementByIdx_x_x("pwd_ok").style.display="block";
      break;
   default:
      document.getElementByIdx_x_x("pwd_small").style.display="block";
          document.getElementByIdx_x_x("pwd_center").style.display="none";
          document.getElementByIdx_x_x("pwd_ok").style.display="none";
   }
 }
}