js正则表达式验证密码强度【推荐】
更新时间：2017年03月03日 11:52:46 作者：chang红达
本文主要介绍了js利用正则表达式验证密码强度的实例，具有很好的参考价值。下面跟着小编一起来看下吧
效果图：
代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>验证密码强度</title>
<style type="text/css">
*{margin: 0;padding: 0;}
body{background:#ccc;}
#demo{width:400px;padding:50px;background:#efefef;border: 1px solid #999;line-height:40px;margin:100px auto 0;}
#strength_length{height:6px;width:100px;padding:2px;border: 1px solid #ccc;}
.lv1{background:red;}
.lv2{background:blue;width:200px;}
.lv3{background:green;width:300px;}
</style>
</head>
<body>
<div id="demo">
<label for="ipt">密码：</label>
<input type="text" id="ipt"><br/>
<em>密码强度：</em><em id="strength"></em>
<div id="strength_length"></div>
</div>
</body>
<script type="text/javascript">
(function(window){
function $(id){
return document.getElementById(id);
};
var arr = ["","低","中","高"];
// 获取对象
var ipt = $("ipt"),strength = $("strength"),strLength = $("strength_length");
// 密码输入事件
ipt.onkeyup = function(){
var s = 0;
var txt = this.value;
if( /[a-zA-Z]/.test(txt) ){
s++;
};
if( /[0-9]/.test(txt) ){
s++;
};
if( /[^0-9a-zA-Z]/.test(txt) ){
s++;
};
if( txt.length <6 ){
s = 0;
};
strength.innerHTML = arr[s];
strLength.className = "lv" + s;
}
})(window)
</script>
</html>
以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持脚本之家！
相关文章
JavaScript+html5 canvas制作的百花齐放效果完整实例
这篇文章主要介绍了JavaScript+html5 canvas制作的百花齐放效果,结合完整实例形式分析了使用html5的canvas技术动态绘制图形的技巧,需要的朋友可以参考下2016-01-01
这篇文章主要介绍了javascript 应用小技巧方法汇总的相关资料,需要的朋友可以参考下2015-07-07
数组是 JavaScript 中最强大的数据结构，我们常常通过将字符串转换为数组来解决许多算法。本文为大家总结了6个JS字符串转数组的方法，希望对你有所帮助2022-09-09
本篇文章主要介绍了浅谈mint-ui 填坑之路，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-11-11
这篇文章主要介绍了JS实现的验证身份证及获取地区功能,结合实例形式分析了JS字符串、数组及正则操作相关技巧,需要的朋友可以参考下2017-01-01
Javascript构造函数是非常强大的,它可能也是Javascript能被充分利用的特点之一,文中通过实例代码介绍的非常详细,这篇文章主要给大家介绍了关于JavaScript构造函数的相关资料,需要的朋友可以参考下2023-04-04
下面小编就为大家带来一篇js的OOP继承实现(必看篇)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-02-02
大家讨论下constructor的作用哈,需要的朋友可以参考下。从51js摘编而来。2011-11-11
链表是一种数据结构,用于存储和组织一系列元素,这些元素以节点的形式连接在一起,每个节点包含数据和一个指向下一个节点的引用,链表可以分为单链表、双链表和循环链表等不同类型,但在本文中,我们将重点关注单链表,需要的朋友可以参考下2023-09-09
这篇文章主要介绍了javascript数组中的map方法和filter方法,文章内容介绍详细，具有一定的参考价值，需要的小伙伴可以参考一下，希望对你的学习有所帮助2022-03-03
最新评论