js判断密码强度的方法
作者：cometwo 时间：2024-04-19 10:58:24
本文实例为大家分享了js判断密码强度的具体代码，供大家参考，具体内容如下
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>密码强度检测</title>
<script type="text/javascript" src="js/jquery-2.2.4.min.js"></script>
<style type="text/css">
body {
font: 12px/1.5 Arial;
}
input {
float: left;
font-size: 12px;
width: 150px;
font-family: arial;
padding: 3px;
border: 1px solid black;
}
input.error {
border: 1px solid red;
}
#tips {
float: left;
margin: 2px 0 0 20px;
}
#tips span {
float: left;
width: 50px;
height: 20px;
color: white;
background: green;
margin-right: 2px;
line-height: 20px;
text-align: center;
}
</style>
<script type="text/javascript">
$(function() {
var aStr = ["弱", "中", "强", "牛逼"];
function checkStrong(val) {
var modes = 0;
if (val.length < 6) return 0;
if (/\d/.test(val)) modes++; //数字
if (/[a-z]/.test(val)) modes++; //小写
if (/[A-Z]/.test(val)) modes++; //大写
if (/\W/.test(val)) modes++; //特殊字符
if (val.length > 12) return 4;
return modes;
};
$(":text").keyup(function() {
var val = $(this).val();
$("p").text(val.length);
var num = checkStrong(val);
switch (num) {
case 0:
break;
case 1:
$("#tips span").css('background', 'yellow').text('').eq(num - 1).css('background', 'red').text(aStr[num - 1]);
break;
case 2:
$("#tips span").css('background', 'green').text('').eq(num - 1).css('background', 'red').text(aStr[num - 1]);
break;
case 3:
$("#tips span").css('background', 'green').text('').eq(num - 1).css('background', 'red').text(aStr[num - 1]);
break;
case 4:
$("#tips span").css('background', 'green').text('').eq(num - 1).css('background', 'red').text(aStr[num - 1]);
break;
default:
break;
}
})
})
</script>
</head>
<body>
<input type="text" value="" maxlength="16" />
<div id="tips"><span></span><span></span><span></span><span></span></div>
<p></p>
</body>
</html>
来源：https://blog.csdn.net/libin_1/article/details/51577472
标签：js,密码强度
0
投稿猜你喜欢
Python基础知识+结构+数据类型
2021-03-11 12:55:33
asp.net 将一个图片以二进制值的形式存入Xml文件中的实例代码
2023-07-23 13:31:30
pytorch DistributedDataParallel 多卡训练结果变差的解决方案
2021-09-24 14:31:43
MySQL数值类型溢出的处理方法
2024-01-19 12:03:34
golang gorm的预加载及软删硬删的数据操作示例
2024-04-25 13:18:34
javascript 跨浏览器的事件系统
2010-07-28 19:34:00
在pycharm中实现删除bookmark
2021-03-18 07:57:24
教你使用Sublime text3搭建Python开发环境及常用插件安装另分享Sublime text3最新激活注册码
2023-08-29 12:08:18
css学习笔记：为什么在IE6下图片会往下掉一行
2009-06-19 12:50:00
在SQL Server中编写通用数据访问方法
2009-01-20 11:35:00
MSSQL2005数据附加失败报错3456解决办法
2024-01-17 23:17:29
TensorBoard 计算图的可视化实现
2021-12-06 19:39:58
Three.js利用orbit controls插件（轨道控制）控制模型交互动作详解
2024-05-22 10:31:00
TensorFlow2.4完成Word2vec词嵌入训练方法详解
2023-10-17 03:23:14
CPQuery 解决拼接SQL的新方法
2024-01-23 22:14:51
Python实现读取目录所有文件的文件名并保存到txt文件代码
2023-08-28 19:27:51
python实现逻辑回归的示例
2022-04-05 05:16:59
python 实现返回一个列表中出现次数最多的元素方法
2023-01-04 14:36:54
mysql中从字段中URL提取域名信息
2009-05-25 10:35:00
python实现循环语句1到100累和
2023-05-15 15:39:38