js密码强度检测代码

//密码强度;
function PasswordStrength(showed){ 
 this.showed = (typeof(showed) == "boolean")?showed:true;
 this.styles = new Array(); 
 this.styles[0] = {backgroundColor:"#EBEBEB",borderLeft:"solid 1px #FFFFFF",borderRight:"solid 1px #BEBEBE",borderBottom:"solid 1px #BEBEBE"}; 
 this.styles[1] = {backgroundColor:"#FF4545",borderLeft:"solid 1px #FFFFFF",borderRight:"solid 1px #BB2B2B",borderBottom:"solid 1px #BB2B2B"};
 this.styles[2] = {backgroundColor:"#FFD35E",borderLeft:"solid 1px #FFFFFF",borderRight:"solid 1px #E9AE10",borderBottom:"solid 1px #E9AE10"};
 this.styles[3] = {backgroundColor:"#95EB81",borderLeft:"solid 1px #FFFFFF",borderRight:"solid 1px #3BBC1B",borderBottom:"solid 1px #3BBC1B"};
 
 this.labels= ["弱","中","强"];

 this.divName = "pwd_div_"+Math.ceil(Math.random()*100000);
 this.minLen = 5;
 
 this.width = "150px";
 this.height = "16px";
 
 this.content = "";
 
 this.selectedIndex = 0;
 
 this.init(); 
}
PasswordStrength.prototype.init = function(){
 var s = '<table cellpadding="0" id="'+this.divName+'_table" cellspacing="0" style="width:'+this.width+';height:'+this.height+';">';
 s += '<tr>';
 for(var i=0;i<3;i++){
  s += '<td id="'+this.divName+'_td_'+i+'" width="33%" align="center"><span style="font-size:1px">&nbsp;</span><span id="'+this.divName+'_label_'+i+'" style="display:none;font-family: Courier New, Courier, mono;font-size: 12px;color: #000000;">'+this.labels[i]+'</span></td>';
 } 
 s += '</tr>';
 s += '</table>';
 this.content = s;
 if(this.showed){
  document.write(s);
  this.copyToStyle(this.selectedIndex);
 } 
}
PasswordStrength.prototype.copyToObject = function(o1,o2){
 for(var i in o1){
  o2[i] = o1[i];
 }
}
PasswordStrength.prototype.copyToStyle = function(id){
 this.selectedIndex = id;
 for(var i=0;i<3;i++){
  if(i == id-1){
   this.$(this.divName+"_label_"+i).style.display = "inline";
  }else{
   this.$(this.divName+"_label_"+i).style.display = "none";
  }
 }
 for(var i=0;i<id;i++){
  this.copyToObject(this.styles[id],this.$(this.divName+"_td_"+i).style);   
 }
 for(;i<3;i++){
  this.copyToObject(this.styles[0],this.$(this.divName+"_td_"+i).style);
 }
}
PasswordStrength.prototype.$ = function(s){
 return document.getElementById(s);
}
PasswordStrength.prototype.setSize = function(w,h){
 this.width = w;
 this.height = h;
}
PasswordStrength.prototype.setMinLength = function(n){
 if(isNaN(n)){
  return ;
 }
 n = Number(n);
 if(n>1){
  this.minLength = n;
 }
}
PasswordStrength.prototype.setStyles = function(){
 if(arguments.length == 0){
  return ;
 }
 for(var i=0;i<arguments.length && i < 4;i++){
  this.styles[i] = arguments[i];
 }
 this.copyToStyle(this.selectedIndex);
}
PasswordStrength.prototype.write = function(s){
 if(this.showed){
  return ;
 }
 var n = (s == 'string') ? this.$(s) : s;
 if(typeof(n) != "object"){
  return ;
 }
 n.innerHTML = this.content;
 this.copyToStyle(this.selectedIndex);
}
PasswordStrength.prototype.update = function(s){
 if(s.length < this.minLen){
  this.copyToStyle(0);
  return;
 }
 var ls = -1;
 if (s.match(/[a-z]/ig)){
  ls++;
 }
 if (s.match(/[0-9]/ig)){
  ls++;
 }
  if (s.match(/(.[^a-z0-9])/ig)){
  ls++;
 }
 if (s.length < 6 && ls > 0){
  ls--;
 }
  switch(ls) {
   case 0:
    this.copyToStyle(1);
    break;
   case 1:
    this.copyToStyle(2);
    break;
   case 2:
    this.copyToStyle(3);
    break;
   default:
    this.copyToStyle(0);
  }
}

时间: 2024-09-14 15:45:19

js密码强度检测代码的相关文章

js密码强度检测_javascript技巧

本文实例讲解了js密码强度检测的实现代码,分享给大家供大家参考,具体内容如下 运行效果图: 这段JavaScript代码比较实用,它完成用户注册时判断用户输入密码的强度,分强.弱.中三等级,它可以根据用户输入的密码显示对应的密码强弱等级,方便用户改进输入. 实现代码: <html> <head> <title>JS判断密码强度</title> <script language=javascript> //判断输入密码的类型 function Ch

javascripit实现密码强度检测代码分享

 这篇文章主要介绍了javascripit实现密码强度检测,大家参考使用吧  代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">  

javascripit实现密码强度检测代码分享_javascript技巧

复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"> <head>    <meta http-equiv=&

passwordStrength 基于jquery的密码强度检测代码使用介绍_jquery

查看示例:DEMO  打包下载 使用很简单. 复制代码 代码如下: $('#pass').passwordStrength(); XHTML 复制代码 代码如下: <p><label>请输入密码:</label> <input type="password" id="pass" class="input" /></p> <div id="passwordStrengthD

js密码强度检测

提示:您可以先修改部分代码再运行 提示:您可以先修改部分代码再运行

js密码强度实时检测代码_javascript技巧

密码强度的判断, 在注册网站用户的时候, 是一个必须要做的事情, 不同的网站, 实现的方式是不一样的. 密码的判断, 其实也就是一个表单验证的其中一项. 那我们来实现这么一个简单的操作. 首先做一个简单的密码输入框和一个显示密码强度的进度条. 整个整体由vali_pass盒子涵盖. 这个盒子包含了标题, 密码框. 再个就是强度进度条. <div class="vali_pass"> <h3>简单的密码强度检测</h3> <input type=

网页密码强度检测实例代码

仿MSN密码强度检测 以下js文件代码:var kNoCanonicalCounterpart = 0; var kCapitalLetter = 0; var kSmallLetter = 1; var kDigit = 2; var kPunctuation = 3; var kAlpha =  4; var kCanonicalizeLettersOnly = true; var kCananicalizeEverything = false; var gDebugOutput = nul

密码强度检测效果实现原理与代码_javascript技巧

复制代码 代码如下: <html> <head> <title>密码强度检测效果</title> <script type="text/javascript"> function chkpwd(obj){ var t=obj.value; var id=getResult(t); //定义对应的消息提示 var msg=new Array(4); msg[0]="密码过短."; msg[1]="密

js密码强度 Password密码检测函数

js密码强度 Password密码检测函数 function click_Password_input(thisinput) {  regPasswordinfo.className = "show exactness";  regPasswordinfo.innerHTML = "1.密码只能由英文字母a-z(不区分大小写).数字0-9._(下划线)组成.<Br>2.密码长度为6-20个字符. "; } function check_Password_