jQuery判断密码强度实现思路及代码


Posted in Javascript onApril 24, 2013

jQuery判断密码强度实现思路及代码

<head> 
<title></title> 
<script src="jquery-1.9.1.js" type="text/javascript"></script> 
<style type="text/css"> 
.qiang{background:url(/images/pas4.JPG) no-repeat;width:150px;height:40px;float:left;} 
.zhong{background:url(/images/pas3.JPG) no-repeat;width:150px;height:40px;float:left;} 
.ruo{background:url(/images/pas2.JPG) no-repeat;width:150px;height:40px;float:left;} 
.ruox{background:url(/images/pas1.JPG) no-repeat;width:150px;height:40px;float:left;} 
.div1css{float:left;width:200px;} 
</style> 
<script type="text/javascript"> 
$(function () { 
$('#pass').keyup(function () { 
var strongRegex = new RegExp("^(?=.{8,})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\\W).*$", "g"); 
var mediumRegex = new RegExp("^(?=.{7,})(((?=.*[A-Z])(?=.*[a-z]))|((?=.*[A-Z])(?=.*[0-9]))|((?=.*[a-z])(?=.*[0-9]))).*$", "g"); 
var enoughRegex = new RegExp("(?=.{6,}).*", "g"); if (false == enoughRegex.test($(this).val())) { 
$('#div2').addClass('ruox'); 
//$('#passstrength').html('小于六位的时候'); //密码小于六位的时候,密码强度图片都为灰色 
} 
else if (strongRegex.test($(this).val())) { 
$('#div2').removeClass('zhong'); 
$('#div2').addClass('qiang'); 
//$('#passstrength').html('强!'); //密码为八位及以上并且字母数字特殊字符三项都包括 
} 
else if (mediumRegex.test($(this).val())) { 
$('#div2').removeClass('ruo'); 
$('#div2').addClass('zhong'); 
//$('#passstrength').html('中!'); //密码为七位及以上并且字母、数字、特殊字符三项中有两项,强度是中等 
} 
else { 
$('#div2').removeClass('ruox'); 
$('#div2').addClass('ruo'); 
//$('#passstrength').html('弱!'); //如果密码为6为及以下,就算字母、数字、特殊字符三项都包括,强度也是弱的 
} 
return true; 
}); 
}) 
</script> 
</head> 
<body> 
<div id="div1" class="div1css"> 
<input type="password" name="pass" id="pass" /></div> 
<div id="div2"><span id="passstrength"></span></div> 
</body>
Javascript 相关文章推荐
JavaScript下申明对象的几种方法小结
Oct 02 Javascript
event.keyCode键码值表 附只能输入特定的字符串代码
May 15 Javascript
JavaScript 获取任一float型小数点后两位的小数
Jun 30 Javascript
jquery实现仿JqueryUi可拖动的DIV实例
Jul 31 Javascript
JavaScript动态创建form表单并提交的实现方法
Dec 10 Javascript
javascript中不易分清的slice,splice和split三个函数
Mar 29 Javascript
TinyMCE汉化及本地上传图片功能实例详解
May 31 Javascript
常用JS图片滚动(无缝、平滑、上下左右滚动)代码大全(推荐)
Dec 20 Javascript
浅谈regExp的test方法取得的值变化的原因及处理方法
Mar 01 Javascript
令按钮悬浮在(手机)页面底部的实现方法
May 02 Javascript
理解Koa2中的async&amp;await的用法
Feb 05 Javascript
策略模式实现 Vue 动态表单验证的方法
Sep 16 Javascript
window.location.reload()方法刷新页面弹出要再次显示该网页对话框
Apr 24 #Javascript
基于JavaScript自定义构造函数的详解说明
Apr 24 #Javascript
Javascript new Date().valueOf()的作用与时间戳由来详解
Apr 24 #Javascript
使用Grunt.js管理你项目的应用说明
Apr 24 #Javascript
javascript获取网页中指定节点的父节点、子节点的方法小结
Apr 24 #Javascript
jQuery文本框(input textare)事件绑定方法教程
Apr 24 #Javascript
为JS扩展Array.prototype.indexOf引发的问题探讨及解决
Apr 24 #Javascript
You might like
一个简单的域名注册情况查询程序
2006/10/09 PHP
windows环境下php配置memcache的具体操作步骤
2013/06/09 PHP
php递归函数中使用return的注意事项
2014/01/17 PHP
php中session退出登陆问题
2014/02/27 PHP
PHP图片等比缩放类SimpleImage使用方法和使用实例分享
2014/04/10 PHP
php提交过来的数据生成为txt文件
2016/04/28 PHP
PHP支付系统设计与典型案例分享
2016/08/02 PHP
php实现页面纯静态的实例代码
2017/06/21 PHP
Yii2.0 RESTful API 基础配置教程详解
2018/12/26 PHP
找到一点可怜的关于dojo资料,谢谢作者!
2006/12/06 Javascript
简明json介绍
2008/09/28 Javascript
兼容IE与firefox火狐的回车事件(js与jquery)
2010/10/20 Javascript
玩转jQuery按钮 请告诉我你最喜欢哪些?
2012/01/08 Javascript
ECMAScript6新增值比较函数Object.is
2015/06/12 Javascript
js实现导航栏中英文切换效果
2017/01/16 Javascript
第一次记录Bootstrap table学习笔记(1)
2017/05/18 Javascript
js 索引下标之li集合绑定点击事件
2018/01/12 Javascript
结合Vue控制字符和字节的显示个数的示例
2018/05/17 Javascript
判断“命令按钮”是否被鼠标单击详解
2019/07/31 Javascript
解决layui弹出层layer的area过大被遮挡的问题
2019/09/21 Javascript
Vue vm.$attrs使用场景详解
2020/03/08 Javascript
微信小程序实现弹幕墙(祝福墙)
2020/11/18 Javascript
[01:10]DOTA2 Supermajor:英雄,由我们见证
2018/05/14 DOTA
Python基于PycURL实现POST的方法
2015/07/25 Python
5种Python单例模式的实现方式
2016/01/14 Python
用TensorFlow实现戴明回归算法的示例
2018/05/02 Python
django多种支付、并发订单处理实例代码
2019/12/13 Python
CSS3之背景尺寸Background-size使用介绍
2013/10/14 HTML / CSS
html5中如何将图片的绝对路径转换成文件对象
2018/01/11 HTML / CSS
Canvas获取视频第一帧缩略图的实现
2020/11/11 HTML / CSS
什么是Smarty变量操作符?如何使用Smarty变量操作符
2014/07/18 面试题
党员教师群众路线思想汇报范文
2014/10/28 职场文书
2014党的群众路线教育实践活动总结材料
2014/10/31 职场文书
2015年爱牙日活动总结
2015/03/23 职场文书
社区党员干部承诺书
2015/05/04 职场文书
小学学习委员竞选稿
2015/11/20 职场文书