jquery验证密码强度的插件

本来是英文版的,我改了一点,提示什么的都是中文的了,

从这里下载 jquery.pstrength.js 强度验证插件!然后在网页中引用jquery文件和这个插件

XML/HTML代码
  1. <script src="/js/jquery.js" type="text/javascript"></script>      
  2. <script type="text/javascript" src="/js/jquery.pstrength.js"></script>   

然后使用以下函数

JavaScript代码
  1. jQuery(document).ready(function(){       
  2.       jQuery('#password1').pstrength();     
  3. });    

#password是你的密码框ID

根据你的情况不同,你可以自定义你的密码强度,我定义的是这样的
 

JavaScript代码
  1. $.extend($.fn, {   
  2.         pstrength: function(options) {   
  3.             var options = $.extend({   
  4.                 verdects: ["很不安全", "不安全", "一般", "安全的", "非常安全"],   
  5.                 colors: ["#f00", "#c06", "#f60", "#3c0", "#3f0"],   
  6.                 scores: [10, 15, 30, 40],   
  7.                 common: ["password", "sex", "god", "123456", "123", "liverpool", "letmein", "qwerty", "monkey"],   
  8.                 minchar: 6   
  9.             }, options);  

 效果如下:



2.

jQuery密码强度检验插件

pass_strength

一款不错的密码强度插件!

jquery.pstrength插件和jquery文件

2 载入jquery文件和jquery.pstrength文件

  1. <script type="text/javascript" src="js/jquery.js"></script> 
  2. <script type="text/javascript" src="js/jquery.pstrength-min.1.2.js">
  3. </script>
  4. <script type="text/javascript">
  5. $(function() {
  6. $('#user_password').pstrength();
  7. });
  8. </script>

3 HTML加入密码输入框,id=”user_password”:

  1. 密码:<input type="password" id="user_password" name="user_password" />

4 css:

  1. .pstrength-minchar {
  2. font-size : 10px;
  3. }
  4. input {
  5. width:180px;
  6. height:12px;
  7. line-height:12px;
  8. padding:4px 0px;
  9. border: #cfcfcf 1px solid;
  10. color: #585858;
  11. }

演示地址

插件官方地址:Ajax Password Strength Meter Script

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值