<img src="http://files.jb51.net/file_images/article/201304/20130424155531.png?2013324155630" alt="jQuery判断密码强度实现思路及代码_javascript技巧" ><br><div class="codetitle"> <span><a style="CURSOR: pointer" data="91749" class="copybut" id="copybut91749" onclick="doCopy('code91749')"><u>复制代码</u></a></span> 代码如下:</div> <div class="codebody" id="code91749"> <br> <br><title></title> <br><script src="jquery-1.9.1.js" type="text/javascript"></script> <br><style type="text/css"> <BR>.qiang{background:url(/images/pas4.JPG) no-repeat;width:150px;height:40px;float:left;} <BR>.zhong{background:url(/images/pas3.JPG) no-repeat;width:150px;height:40px;float:left;} <BR>.ruo{background:url(/images/pas2.JPG) no-repeat;width:150px;height:40px;float:left;} <BR>.ruox{background:url(/images/pas1.JPG) no-repeat;width:150px;height:40px;float:left;} <BR>.div1css{float:left;width:200px;} <BR></style> <br><script type="text/javascript"> <BR>$(function () { <BR>$('#pass').keyup(function () { <BR>var strongRegex = new RegExp("^(?=.{8,})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\\W).*$", "g"); <BR>var mediumRegex = new RegExp("^(?=.{7,})(((?=.*[A-Z])(?=.*[a-z]))|((?=.*[A-Z])(?=.*[0-9]))|((?=.*[a-z])(?=.*[0-9]))).*$", "g"); <BR>var enoughRegex = new RegExp("(?=.{6,}).*", "g"); <br><br>if (false == enoughRegex.test($(this).val())) { <BR>$('#div2').addClass('ruox'); <BR>//$('#passstrength').html('小于六位的时候'); //密码小于六位的时候，密码强度图片都为灰色 <BR>} <BR>else if (strongRegex.test($(this).val())) { <BR>$('#div2').removeClass('zhong'); <BR>$('#div2').addClass('qiang'); <BR>//$('#passstrength').html('强!'); //密码为八位及以上并且字母数字特殊字符三项都包括 <BR>} <BR>else if (mediumRegex.test($(this).val())) { <BR>$('#div2').removeClass('ruo'); <BR>$('#div2').addClass('zhong'); <BR>//$('#passstrength').html('中!'); //密码为七位及以上并且字母、数字、特殊字符三项中有两项，强度是中等 <BR>} <BR>else { <BR>$('#div2').removeClass('ruox'); <BR>$('#div2').addClass('ruo'); <BR>//$('#passstrength').html('弱!'); //如果密码为6为及以下，就算字母、数字、特殊字符三项都包括，强度也是弱的 <BR>} <BR>return true; <BR>}); <BR>}) <BR></script> <br> <br> <br><div id="div1" class="div1css"> <br><input type="password" name="pass" id="pass"> </div> <br><div id="div2"><span id="passstrength"></span></div> <br> <br> </div>
