js密码强度校验


Posted in Javascript onNovember 10, 2015

现在很多论坛和博客都在用户注册时添加了验证密码强度的功能,在以前的文章中,我们曾经给出过一段检验密码强度的例子,今天再看一个与《js密码强度校验》的代码。

效果:

js密码强度校验

<html>
<head>
<script language="javascript">
//CharMode函数
//测试某个字符是属于哪一类.
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 /= 2;
 }
 return modes;
}
//checkStrong函数
//返回密码的强度级别
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);
}
//pwStrength函数
//当用户放开键盘或密码输入框失去焦点时,根据不同的级别显示不同的颜色
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;
}
</script>

</head>

<body>

<form>
输入密码:<input type="password" size="10" onKeyUp="pwStrength(this.value)" onBlur="pwStrength(this.value)">
<br>密码强度:
 <table width="217" border="1" cellspacing="0" cellpadding="1" bordercolor="#cccccc" height="20">
 <tr align="center" bgcolor="#eeeeee">
 <td width="33%" id="strength_L">弱</td>
 <td width="33%" id="strength_M">中</td>
 <td width="33%" id="strength_H">强</td>
 </tr>
 </table>
</form>

</body>
</html>

以上就是为大家分享的js密码强度校验的全部代码,希望对大家的学习有所帮助。

Javascript 相关文章推荐
onpropertypchange
Jul 01 Javascript
js+FSO遍历文件夹下文件并显示
Mar 07 Javascript
jquery禁止输入数字以外的字符的示例(纯数字验证码)
Apr 10 Javascript
简单谈谈javascript代码复用模式
Jan 28 Javascript
Vue中fragment.js使用方法详解
Mar 09 Javascript
JavaScript实现HTML5游戏断线自动重连的方法
Sep 18 Javascript
input 标签实现输入框带提示文字效果(两种方法)
Oct 09 Javascript
微信小程序使用checkbox显示多项选择框功能【附源码下载】
Dec 11 Javascript
webpack中的热刷新与热加载的区别
Apr 09 Javascript
使用NestJS开发Node.js应用的方法
Dec 03 Javascript
Quasar Input:type=&quot;number&quot; 去掉上下小箭头 实现加减按钮样式功能
Apr 09 Javascript
详解基于element的区间选择组件校验(交易金额)
Jan 07 Javascript
详解javascript函数的参数
Nov 10 #Javascript
JavaScript函数的一些注意要点小结及js匿名函数
Nov 10 #Javascript
javascript实现五星评分功能
Nov 10 #Javascript
javascript实现密码验证
Nov 10 #Javascript
JavaScript编程的单例设计模讲解
Nov 10 #Javascript
js数组常见操作及数组与字符串相互转化实例详解
Nov 10 #Javascript
浅谈javascript中replace()方法
Nov 10 #Javascript
You might like
如何利用php+mysql保存和输出文件
2006/10/09 PHP
yii2分页之实现跳转到具体某页的实例代码
2016/06/02 PHP
利用php生成验证码
2017/02/23 PHP
深入解析PHP底层机制及相关原理
2020/12/11 PHP
jQuery.query.js 取参数的两点问题分析
2012/08/06 Javascript
Javascript设置对象的ReadOnly属性(示例代码)
2013/12/25 Javascript
JavaScript获取当前网页最后修改时间的方法
2015/04/03 Javascript
javascript控制层显示或隐藏的方法
2015/07/22 Javascript
AngularJS实现表单手动验证和表单自动验证
2015/12/09 Javascript
全面了解javascript中的错误处理机制
2016/07/18 Javascript
全屏滚动插件fullPage.js使用实例解析
2016/10/21 Javascript
jQuery实现圣诞节礼物动画案例解析
2016/12/25 Javascript
AngularJS路由切换实现方法分析
2017/03/17 Javascript
详解NodeJS框架express的路径映射(路由)功能及控制
2017/03/24 NodeJs
JS实现弹出下载对话框及常见文件类型的下载
2017/07/13 Javascript
微信小程序列表渲染功能之列表下拉刷新及上拉加载的实现方法分析
2017/11/27 Javascript
spring+angular实现导出excel的实现代码
2019/02/27 Javascript
微信小程序图表插件wx-charts用法实例详解
2019/05/20 Javascript
vue 实现tab切换保持数据状态
2020/07/21 Javascript
vue 实现根据data中的属性值来设置不同的样式
2020/08/04 Javascript
WebStorm无法正确识别Vue3组合式API的解决方案
2021/02/18 Vue.js
Python中给List添加元素的4种方法分享
2014/11/28 Python
在Python的Django框架中使用通用视图的方法
2015/07/21 Python
Python 基础教程之str和repr的详解
2017/08/20 Python
python获取代码运行时间的实例代码
2018/06/11 Python
python fuzzywuzzy模块模糊字符串匹配详细用法
2019/08/29 Python
Python列表list操作相关知识小结
2020/01/29 Python
Django认证系统user对象实现过程解析
2020/03/02 Python
keras 如何保存最佳的训练模型
2020/05/25 Python
HTML5 Canvas基本线条绘制的实例教程
2016/03/17 HTML / CSS
Vector, ArrayList, HashTable, HashMap哪些是线程安全的,哪些不是
2015/10/12 面试题
小学门卫岗位职责
2013/12/17 职场文书
秦兵马俑教学反思
2014/02/07 职场文书
银行青年文明号事迹材料
2014/05/31 职场文书
伊索寓言读书笔记
2015/06/30 职场文书
环保主题班会教案
2015/08/13 职场文书