使用JavaScript怎么检测四级密码强度

使用JavaScript怎么检测四级密码强度?很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。

成都创新互联公司成立于2013年,我们提供高端成都网站建设成都网站制作成都网站设计、网站定制、成都全网营销推广微信小程序开发、微信公众号开发、网站推广服务,提供专业营销思路、内容策划、视觉设计、程序开发来完成项目落地,为垃圾桶企业提供源源不断的流量和订单咨询。

具体如下:



 
  密码强度检测 
 
 
 input{float: left; font-size: 14px; width: 250px; height: 25px; border: 1px solid #ccc; padding-left: 10px;}
 #tips{float: left; font-size: 12px; width: 400px; height: 25px; margin: 4px 0 0 20px;}
 #tips span{float: left; width: 40px; height: 20px; color: #fff; overflow:hidden; margin-right: 10px; background: #D7D9DD; line-height:20px; text-align: center; }
 #tips .s1{background: #F45A68;}/*红色*/
 #tips .s2{background: #fc0;}/*橙色*/
 #tips .s3{background: #cc0;}/*黄色*/
 #tips .s4{background: #14B12F;}/*绿色*/
 
 
 
 
 
 
 
 
 很强
 
   var password = document.getElementById("password"); //获取文本框的对象  //var value = password.value; //获取用户在文本框里面填写的值  //获取所有的span标签 返回值是一个数组  var spanDoms = document.getElementsByTagName("span");  password.onkeyup = function(){   //获取用户输入的密码,然后判断其强度 返回0 或者 1 2 3 4   var index = checkPassWord(this.value);   for(var i = 0; i 

说明:这里实现的功能主要是,输入密码的时候,一边输一边检测,有四个安全级别,当输入的密码符合某个级别的规则时,该级别的标志条就会高亮变色。

下面是测试的情况,(这里为了能看到效果,所以把type=“password”故意改成type=“text”),至于检测中级别的规则,读者可以自己根据需要自行修改,主要是js正则表达式的修改。另外,当把最后一个图片的输入内容,逐步地删除,直到只剩第一个图片的输入内容,这一过程中,效果就是下面的 从下到上变化了

使用JavaScript怎么检测四级密码强度

使用JavaScript怎么检测四级密码强度

使用JavaScript怎么检测四级密码强度

使用JavaScript怎么检测四级密码强度

看完上述内容是否对您有帮助呢?如果还想对相关知识有进一步的了解或阅读更多相关文章,请关注创新互联行业资讯频道,感谢您对创新互联的支持。


文章题目:使用JavaScript怎么检测四级密码强度
当前URL:http://azwzsj.com/article/gdhich.html

其他资讯