当前位置:萝卜系统 > 硬件软件教程 > 详细页面

正则表达式的JS密码强度检查(容易易用)

正则表达式的JS密码强度检查(容易易用)

更新时间:2023-06-22 文章作者:未知 信息来源:网络 阅读次数:

根据运行的环境,操作系统可以分为桌面操作系统,手机操作系统,服务器操作系统,嵌入式操作系统等。

js确认密码正则表达式_js正则表达式 数字替换_js密码强度正则表达式

最近,我一直在通过一个通行证项目,并且密码强度需要在注册模块中显示(低,中和高). 今天,我将与您分享结果. 该代码不像搜索那么复杂js密码强度正则表达式,并且可以满足一般需求.

HTML代码如下:

js确认密码正则表达式_js密码强度正则表达式_js正则表达式 数字替换

<!DOCTYPE HTML>
<html lang="en">
<head>
  <meta charset="utf-8"/>
  <title>密码强度</title>
  <style type="text/css">
  #passStrength{height:6px;width:120px;border:1px solid #ccc;padding:2px;}
  .strengthLv1{background:red;height:6px;width:40px;}
  .strengthLv2{background:orange;height:6px;width:80px;}
  .strengthLv3{background:green;height:6px;width:120px;}
  </style>
</head>
<body>
  <input type="password" name="pass" id="pass" maxlength="16"/>
  <div class="pass-wrap">
    <em>密码强度:</em>
    <div id="passStrength"></div>
  </div>
</body>
</html>
<script type="text/javascript" src="js/passwordStrength.js"></script>
<script type="text/javascript">
new PasswordStrength('pass','passStrength');
</script>

js代码如下:

js确认密码正则表达式_js密码强度正则表达式_js正则表达式 数字替换

function PasswordStrength(passwordID,strengthID){
  this.init(strengthID);
  var _this = this;
  document.getElementById(passwordID).onkeyup = function(){
    _this.checkStrength(this.value);
  }
};
PasswordStrength.prototype.init = function(strengthID){
  var id = document.getElementById(strengthID);
  var div = document.createElement('div');
  var strong = document.createElement('strong');
  this.oStrength = id.appendChild(div);
  this.oStrengthTxt = id.parentNode.appendChild(strong);
};
PasswordStrength.prototype.checkStrength = function (val){
  var aLvTxt = ['','低','中','高'];
  var lv = 0;
  if(val.match(/[a-z]/g)){lv++;}
  if(val.match(/[0-9]/g)){lv++;}
  if(val.match(/(.[^a-z0-9])/g)){lv++;}
  if(val.length < 6){lv=0;}
  if(lv > 3){lv=3;}
  this.oStrength.className = 'strengthLv' + lv;
  this.oStrengthTxt.innerHTML = aLvTxt[lv];
};

效果图:

js正则表达式 数字替换_js确认密码正则表达式_js密码强度正则表达式

使用说明:

js密码强度正则表达式_js正则表达式 数字替换_js确认密码正则表达式

1. 该对象的第一个参数是密码输入框的ID,第二个参数是密码强度栏的ID.

2. 密码强度的规则可以在checkStrength方法中自定义.

3. 密码强度显示的低js密码强度正则表达式,中和高分别对应于三种css样式(strengthLv1,强度Lv2,强度Lv3).

上面是小编引入的JS密码强度验证的正则表达式. 希望对大家有帮助. 如有任何疑问,请给我留言,小编会及时给您答复. 非常感谢您对Script House网站的支持!


本文来自本站,转载请注明本文网址:
http://www.pc-fly.com/a/jisuanjixue/article-257964-1.html



温馨提示:喜欢本站的话,请收藏一下本站!

本类教程下载

系统下载排行

网站地图xml | 网站地图html