资讯

精准传达 • 有效沟通

从品牌网站建设到网络营销策划,从策略到执行的一站式服务

JavaScript实现密码强度实时验证的方法

小编给大家分享一下JavaScript实现密码强度实时验证的方法,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!

创新互联主营抚松网站建设的网络公司,主营网站建设方案,app软件定制开发,抚松h5小程序制作搭建,抚松网站营销推广欢迎抚松等地区企业咨询

在网络服务中,为了保证用户的私密信息足够安全,会要求用户输入具有一定安全级别的密码,这样可以更好的防止他人盗用。比如在注册一些游戏账号时,如果输入纯数字或纯英文字符低于6位,就会提示密码强度太低,请重新输入。一些密码强度验证的方法都是计算字符的类型,然后分类加权累算。权重越高,相应的强度也就越高。

具体的写法及实现方式有很多种,本文只介绍其中一种方案




 
 密码强度实时验证



 

密码强度实时验证

      window.onload = function () {    function setCss(_this,cssOption){    //判断节点类型    if (!_this || _this.nodeType ===3 || _this.nodeType === 8 ||!_this.style) {     return;    }    for(var cs in cssOption){     _this.style[cs] = cssOption[cs];    }    return _this;   }    function trim(chars){    return (chars ||"").replace(/^(\s|\u00a0)+|(\s|\u00a0)+$/g,"");   }   function passwordStrength(passwordStrength,showStrength){    var self = this;    /*字符权重;    数字1,字母2,其他字符为3    当密码长度小于6时不符合标准    长度>=6,强度小于10,强度弱    长度>=6,长度>=10且<15,强度中    长度>=6,强度>=15,强*/    passwordStrength.onkeyup = function(){     var _color = ["red","yellow","orange","green"],       msgs = ["密码太短","弱","中","强"],       _strength = 0,       _v= trim(passwordStrength.value)     _vL= _v.length,       i=0;     var charStrength = function(char){      //计算单个字符强度      if(char>=48 && char <=57){//数字       return 1;      }      if(char>=97 && char<=122){//小写       return 2;      }else{       return 3; //特殊字符      }     }     if(_vL<6){//计算模式      showStrength.innerText = msgs[0];      setCss(showStrength,{       "color":_color[0]      })     }else{      for(;i<_vL;i++){       //遍历字符       _strength+=charStrength(_v.toLocaleLowerCase().charCodeAt(i));      }      if(_strength<10){       //强度小于10       showStrength.innerText = msgs[1];       setCss(showStrength,{        "color":_color[1]       })      }      if(_strength>=10&&_strength<15){       showStrength.innerText = msgs[2];       setCss(showStrength,{        "color":_color[2]       })      }      if(_strength>=15){       showStrength.innerText = msgs[3];       setCss(showStrength,{        "color":_color[3]       })      }     }    }   }   passwordStrength(     document.getElementById("passwordStrength"),     document.getElementById("showStrength"));  };  

看完了这篇文章,相信你对“JavaScript实现密码强度实时验证的方法”有了一定的了解,如果想了解更多相关知识,欢迎关注创新互联行业资讯频道,感谢各位的阅读!


文章标题:JavaScript实现密码强度实时验证的方法
标题链接:http://www.cdkjz.cn/article/ghphss.html
多年建站经验

多一份参考,总有益处

联系快上网,免费获得专属《策划方案》及报价

咨询相关问题或预约面谈,可以通过以下方式与我们联系

大客户专线   成都:13518219792   座机:028-86922220