六狼论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

新浪微博账号登陆

只需一步,快速开始

搜索
查看: 306|回复: 0

JS检查密码强弱(jquery框架支持)

[复制链接]

升级  68%

8

主题

8

主题

8

主题

童生

Rank: 1

积分
34
 楼主| 发表于 2013-2-8 01:03:26 | 显示全部楼层 |阅读模式
请自行下载jquery框架验证。本例已经经jquery-1.4.2.min.js验证通过。

var ValidatePwd = {Pwd : {color: ['#E6EAED', '#AC0035', '#FFCC33', '#639BCC', '#246626'],text: ['太短', '弱', '一般', '很好', '极佳']},Result : 0,ColorInit : function(){$('#pwdStrong_1,#pwdStrong_2,#pwdStrong_3,#pwdStrong_4').css({"background-color":ValidatePwd.Pwd.color[0]});},Evaluate : function(word) {if (word == "") {this.Result = 0;} else if (word.length < 6) {this.Result =  1;} else {this.Result =  word.match(/[a-z](?![^a-z]*[a-z])|[A-Z](?![^A-Z]*[A-Z])|\d(?![^\d]*\d)|[^a-zA-Z\d](?![a-zA-Z\d]*[^a-zA-Z\d])/g).length;} },Check : function(value){this.Evaluate(value);this.ColorInit();this.textColor();},textColor : function(){console.log( this.Result );var j=0;for(j;j<parseInt(this.Result);j++){$("#pwdStrong_"+j).css({"background-color":ValidatePwd.Pwd.color[j]});}$('#pwdStrong_text').text( ValidatePwd.Pwd.text[j] ).css({"background-color":ValidatePwd.Pwd.color[j]});}}

附加html格式:
<form ><div><table><tr><td>密码:</td><td><input id="txtPassword" type="password" name="password" style="width: 130px;" maxlength="16"  /></td><td><div id="tipPosition"></div></td></tr><tr><td></td><td><table id="pwdStrong_color"><tr><td id="pwdStrong_1"></td><td id="pwdStrong_2"></td><td id="pwdStrong_3"></td><td id="pwdStrong_4"></td></tr></table></td><td><div id="pwdStrong_text"></div></td></tr></table></div></form>

附加CSS样式:

<style>body{font: 13px 宋体;}#tipPosition{width: 400px;height: 16px;line-height: 18px;padding: 2px 30px;}.tip{background: #E6F2FF url(images/register_tip.png) no-repeat 10px center;border: 1px #0E5863 dashed;color: #0E5863;}.error{background: #FBECDF url(images/register_error.png) no-repeat 10px center;border: 1px Red dashed;color: #6D3737;}.success{background: #D6FCD2 url(images/register_success.png) no-repeat 10px center;border: 1px #2F5D36 dashed;color: #3D934A;}#pwdStrong_color{width: 136px;height: 3px;border: 0px;border-collapse: collapse;border-spacing: 0;background: #E6EAED;margin-top: 5px;}#pwdStrong_color td{padding: 0px;width: 44px; }#pwdStrong_text{font: 12px 宋体;} </style>

调用:
jQuery(function($) {$("input[name=password]").keydown(function(){//ValidatePwd.Check( $(this).val() );});});
您需要登录后才可以回帖 登录 | 立即注册 新浪微博账号登陆

本版积分规则

快速回复 返回顶部 返回列表