passwordStrength 基于jquery的密码强度检测代码使用介绍
更新时间：2011年10月08日 23:15:53 作者：
我们设定密码强度等级为10，制作一张图片表示每个等级状态，给密码框绑定keyup事件，通过keyup事件获取密码值，然后使用正则进行判断密码强度等级，然后变换相应的图片
查看示例：DEMO 打包下载
$('#pass').passwordStrength();
XHTML
<p><label>请输入密码：</label>
<input type="password" id="pass" class="input" /></p>
<div id="passwordStrengthDiv" class="is0"></div>
<p><label>确认密码：</label>
<input type="password" id="repass" class="input" /></p>
注意：id#passwordStrengthDiv的DIV是用来加载强度图片的，你也可以自定义ID，但调用时就要给参数赋值：
targetDiv : '#ID' //自定义加载图片的ID
载入JS和CSS：
<link rel="stylesheet" type="text/css" href="style/main.css" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.passwordStrength.js"></script>
<script type="text/javascript">
$(function(){
$('#pass').passwordStrength();
});
</script>
使用很简单。
复制代码 代码如下:
$('#pass').passwordStrength();
XHTML
复制代码 代码如下:
<p><label>请输入密码：</label>
<input type="password" id="pass" class="input" /></p>
<div id="passwordStrengthDiv" class="is0"></div>
<p><label>确认密码：</label>
<input type="password" id="repass" class="input" /></p>
注意：id#passwordStrengthDiv的DIV是用来加载强度图片的，你也可以自定义ID，但调用时就要给参数赋值：
复制代码 代码如下:
targetDiv : '#ID' //自定义加载图片的ID
载入JS和CSS：
复制代码 代码如下:
<link rel="stylesheet" type="text/css" href="style/main.css" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.passwordStrength.js"></script>
<script type="text/javascript">
$(function(){
$('#pass').passwordStrength();
});
</script>
相关文章
在平时的项目中，我们经常需要一些特效链接，如果使效果进一步加强，我们可以使点击锚点链接平滑滚动到锚点，下面就来给大家讲解下如何使用jQuery来实现。2015-05-05
这里推荐给大家一款jquery动态云标签的插件，非常的炫，在指定块级元素内动态生成a标签，a标签的高度、宽度、位置、层数、背景颜色随机可控，a标签渐隐显示和渐隐消失，可改变初始化的透明度，鼠标悬浮停止动画且透明度最大，层数最高，鼠标离开，恢复之前状态2014-11-11
这篇文章主要介绍了关于jQuery.ajax()的jsonp碰上post的相关资料，文中通过示例代码介绍的非常详细，对大家具有一定的参考学习价值，需要的朋友们下面来一起看看吧。2017-07-07
昨天突然有网友问我animate()方法可以来操作所有css属性吗？是的，我告诉他可以的。不过，在此有需要注意点需要大家搞清楚。接下来通过本篇文章给大家介绍基于jquery animate操作css样式属性小结，对jquery animate css相关知识感兴趣的朋友一起学习吧2015-11-11
这篇文章主要介绍了jquery 插件重新绑定的处理方法,结合实例形式分析了jQuery插件解除绑定与重新绑定的具体操作技巧,需要的朋友可以参考下2019-11-11
本文为大家介绍下使用jquery验证邮箱、验证手机号码，具体实现思路及代码如下，感兴趣的朋友可以学习下2013-07-07
jQuery 的 get 和 post 方法有三个参数：地址，数据 和回调函数，刚刚做了几个实验，看看下面的代码就清楚了2014-08-08
下面小编就为大家带来一篇jQuery效果函数。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧，祝大家游戏愉快哦2016-09-09
很简单的一个效果插件,但不是经常用,怕忘了,以后在用又要去看文档,所以现在把笔记写下来,方便以后2010-08-08
jQuery实现导航滚动到指定内容效果完整实例【附demo源码下载】
这篇文章主要介绍了jQuery实现导航滚动到指定内容效果,结合完整实例形式分析了页面元素属性动态变换操作相关技巧,涉及jQuery插件jquery.scrollto.js的使用,并附带demo源码下载供读者下载参考,需要的朋友可以参考下2016-09-09
最新评论