js检验密码强度（低中高)附图

最近一直在做通行证项目，里面的注册模块中输入密码需要显示密码强度（低中高)。今天就把做的效果给大家分享下，代码没有网上搜索的那么复杂，能够满足一般的需求html。代码如下：复制代码代码如下：DOCTYPE HTML HTML lang=' en ' head meta charset=' utf-8 '/title密码强度/title style type=' text/CSS ' # pass strength { height :6 px；宽度宽度：120pxborder:1px固体# cccpadding:2px}。实力LV 1 {背景：红；高度：6像素宽度：40 px} .实力LV 2 {背景：橙色；高度：6像素宽度：80 px} .实力LV 3 {背景：绿色；高度：6像素宽度宽度：120 px }/样式/头部主体输入类型=' password ' name=' pass ' id=' pass ' maxlength=' 16 '/div class=' pass-wrap ' em密码强度：/em div id='传递强度'/div/div/body/html脚本类型=' text/JavaScript ' src=' http : js/PasswordStrength。js /脚本脚本类型=' text/JavaScript ' new PasswordStrength(' pass '，' pass strength ')；/script js代码如下：复制代码代码如下：函数PasswordStrength(passwordsid，strengid){ this。init(strengid)；var _ this=文档。getelementbyid(密码id).onkeyup=function(){ _ this。检查强度(这个。值)；} };密码强度。原型。init=function(strengid){ var id=document。getelementbyid(strengid)；var div=文档。创建元素(' div ')；var strong=文档。创建元素(' strong ')；这个。ostr ength=id。append child(div)；这个。ostrengthttxt=id。parentnode。appendchild(强)；};密码强度。原型。检查强度=函数(val){ var aLvTxt=[' '，'低','中','高'];var LV=0；if(val。match(/[a-z]/g)){ LV；} if(val。匹配(/[0-9]/g)){ LV；} if(val。匹配()/(.[^a-z0-9])/g)){lv；} if(val。长度6){ LV=0；} if(LV 3){ LV=3；}这个。奥斯特恩格思。名字‘强LV’LV；这个。ostrengthttxt。innerhtml=aLvTxt[LV]；};效果图

使用说明： 1、对象的第一个参数是密码输入框的id，第二个参数是密码强度长条的身份证.2、检查强度方法中可以自定义密码强度的规则。 3、密码强度显示低中高分别对应3个钢性铸铁样式（强度1、强度2、强度3)。