JavaScript判断密码强度(自写代码)


Posted in Javascript onSeptember 06, 2013

在一些网站注册的时候经常可以看到密码强度提示,例如优酷:
JavaScript判断密码强度(自写代码) 
今天自己做了一个JS密码强度判断,效果如下:
JavaScript判断密码强度(自写代码) 
以下是代码:

<html> 
<head> 
<title>JS判断密码强度</title> 
<script language=javascript> 
//判断输入密码的类型 
function CharMode(iN){ 
if (iN>=48 && iN <=57) //数字 
return 1; 
if (iN>=65 && iN <=90) //大写 
return 2; 
if (iN>=97 && iN <=122) //小写 
return 4; 
else 
return 8; 
} 
//bitTotal函数 
//计算密码模式 
function bitTotal(num){ 
modes=0; 
for (i=0;i<4;i++){ 
if (num & 1) modes++; 
num>>>=1; 
} 
return modes; 
} 
//返回强度级别 
function checkStrong(sPW){ 
if (sPW.length<=4) 
return 0; //密码太短 
Modes=0; 
for (i=0;i<sPW.length;i++){ 
//密码模式 
Modes|=CharMode(sPW.charCodeAt(i)); 
} 
return bitTotal(Modes); 
} //显示颜色 
function pwStrength(pwd){ 
O_color="#eeeeee"; 
L_color="#FF0000"; 
M_color="#FF9900"; 
H_color="#33CC00"; 
if (pwd==null||pwd==''){ 
Lcolor=Mcolor=Hcolor=O_color; 
} 
else{ 
S_level=checkStrong(pwd); 
switch(S_level) { 
case 0: 
Lcolor=Mcolor=Hcolor=O_color; 
case 1: 
Lcolor=L_color; 
Mcolor=Hcolor=O_color; 
break; 
case 2: 
Lcolor=Mcolor=M_color; 
Hcolor=O_color; 
break; 
default: 
Lcolor=Mcolor=Hcolor=H_color; 
} 
} 
document.getElementById("strength_L").style.background=Lcolor; 
document.getElementById("strength_M").style.background=Mcolor; 
document.getElementById("strength_H").style.background=Hcolor; 
return; 
} 
</script> 
</head> 
<body> 
<form name=form1 action="" > 
<table width="250" border="0" cellpadding=2" bordercolor="#eeeeee" style='display:inline'> 
<tr> 
<td width="40%" align="right">密码:</td> 
<td colspan="3" align="left"> 
<input type=password size=20 onKeyUp=pwStrength(this.value) onBlur=pwStrength(this.value)> 
</td> 
</tr> 
<tr align="center"> 
<td width="40%" align="right">密码强度:</td> 
<td width="20%" id="strength_L" bgcolor="#f5f5f5">弱</td> 
<td width="20%" id="strength_M" bgcolor="#f5f5f5">中</td> 
<td width="20%" id="strength_H" bgcolor="#f5f5f5">强</td> 
</tr> 
</table> 
</form> 
</body> 
</html>
Javascript 相关文章推荐
JQuery 引发两次$(document.ready)事件
Jan 15 Javascript
JavaScript中的类继承
Nov 25 Javascript
JavaScript性能陷阱小结(附实例说明)
Dec 28 Javascript
自己动手开发jQuery插件教程
Aug 25 Javascript
node.js中的console.trace方法使用说明
Dec 09 Javascript
jquery拖拽排序简单实现方法(效果增强版)
Feb 16 Javascript
关于安卓手机微信浏览器中使用XMLHttpRequest 2上传图片显示字节数为0的解决办法
May 17 Javascript
Node.js利用js-xlsx处理Excel文件的方法详解
Jul 05 Javascript
Easyui Datagrid自定义按钮列(最后面的操作列)
Jul 13 Javascript
详解angular脏检查原理及伪代码实现
Jun 08 Javascript
vue项目中实现缓存的最佳方案详解
Jul 11 Javascript
微信小程序全局变量的设置、使用、修改过程解析
Sep 24 Javascript
js实现连续英文字符自动换行兼容ie6 ie7和firefox
Sep 06 #Javascript
让网页跳转到指定位置的jquery代码非书签
Sep 06 #Javascript
jquery中prop()方法和attr()方法的区别浅析
Sep 06 #Javascript
CheckBoxList多选样式jquery、C#获取选择项
Sep 06 #Javascript
jquery阻止冒泡事件使用模拟事件
Sep 06 #Javascript
Jquery的hover方法让鼠标经过li时背景变色
Sep 06 #Javascript
Jquery的hide及toggle方法让超链接慢慢消失
Sep 06 #Javascript
You might like
关于PHP 如何用 curl 读取 HTTP chunked 数据
2016/02/26 PHP
PHP7.1新功能之Nullable Type用法分析
2016/09/26 PHP
HTML5附件拖拽上传drop &amp; google.gears实现代码
2011/04/28 Javascript
javascript学习笔记(五) Array 数组类型介绍
2012/06/19 Javascript
使用js获取地址栏中传递的值
2013/07/02 Javascript
javascript数组操作总结和属性、方法介绍
2014/04/05 Javascript
原生js结合html5制作小飞龙的简易跳球
2015/03/30 Javascript
jquery实现全选、反选、获得所有选中的checkbox
2020/09/13 Javascript
Java遍历集合方法分析(实现原理、算法性能、适用场合)
2016/04/25 Javascript
js实现目录链接,内容跟着目录滚动显示的简单实例
2016/10/15 Javascript
JavaScript数据结构之二叉树的查找算法示例
2017/04/13 Javascript
Angular2使用Augury来调试Angular2程序
2017/05/21 Javascript
mui框架 页面无法滚动的解决方法(推荐)
2018/01/25 Javascript
JavaScript实现多叉树的递归遍历和非递归遍历算法操作示例
2018/02/08 Javascript
小程序登录态管理的方法示例
2018/11/13 Javascript
jquery+php后台实现省市区联动功能示例
2019/05/23 jQuery
JavaScript原型继承和原型链原理详解
2020/02/04 Javascript
如何基于jQuery实现五角星评分
2020/09/02 jQuery
[19:15]DK战队纪录片
2014/09/02 DOTA
[44:40]Spirit vs Navi Supermajor小组赛 A组败者组第一轮 BO3 第一场 6.2
2018/06/03 DOTA
Python编程语言的35个与众不同之处(语言特征和使用技巧)
2014/07/07 Python
Python中使用logging模块代替print(logging简明指南)
2014/07/09 Python
python基于pyDes库实现des加密的方法
2017/04/29 Python
Python SQLite3简介
2018/02/22 Python
Python面向对象封装操作案例详解
2019/12/31 Python
pycharm不能运行.py文件的解决方法
2020/02/12 Python
浅谈python多线程和多线程变量共享问题介绍
2020/04/17 Python
纯CSS3实现圆角效果(含IE兼容解决方法)
2014/05/07 HTML / CSS
澳大利亚百货公司:David Jones
2018/02/08 全球购物
趣天网日本站:Qoo10 JP
2019/09/18 全球购物
大学生的网上创业计划书
2013/12/31 职场文书
查摆问题整改措施范文
2014/10/11 职场文书
赢在中国观后感
2015/06/02 职场文书
导游词之镇江焦山
2019/11/21 职场文书
游戏《东方异文石:爱亚利亚黎明》正式版发布
2022/04/03 其他游戏
《火纹风花雪月无双》预告“神秘雇佣兵” 紫发剑客
2022/04/13 其他游戏