<!doctype html>

<html>

<head>

<script src="http://ajax.microsoft.com/ajax/jQuery/jquery-1.7.2.min.js"></script>

    <script type="text/javascript">

function getPasswordStrength(password){

  var strength=0;

  $([/.{6,}/,/[0-9]+/,/[a-z]+/,/[A-Z]+/,/[^0-9a-zA-Z]+/]).each(function(i,o){

      console.log(i,o,strength);

      if(o.test(password)) strength++;

  });

  return strength;

}

function showStrength(password) {

  var strength = getPasswordStrength(password);

  var status = strength < 3 ? 'low' : (strength < 5 ? 'medium' : 'high');

  var desc = strength < 3 ? '强度很低' : (strength < 5 ? '中等强度' : '高强度');

  $('#passwordStrength').attr('class',status).html(desc);

}

    </script>

<style>

/*密码强度样式的定义*/

.high{color:green}

.medium{color:blue}

.low{color:red}

</style>

</head>

<body>

<form>

密码： <input type="password" onkeyup="showStrength(this.value)"/> <span id="passwordStrength"></span>

</form>

</body>

</html>

密码强度demo（弱中强）的更多相关文章

  1. JS 密码弱中强显示

    <!DOCTYPE html><html><head>    <meta http-equiv="Content-Type" conten ...

  2. 使用javascript对密码进行有密码强度提示的验证

    好些网站的注册功能中,都有对密码进行验证并且还有强度提示.下面就来实现这种效果.密码强度说明:密码强度:弱——纯数字,纯字母,纯符号密码强度:中——数字,字母,符号任意两种的组合密码强度:强——数字, ...

  3. js密码强度

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. 密码强度的js插件（完成）

    效果如下图: 低:

  5. 密码强度应用(js)

    <!-- 密码强度div --> <div id="tips" class="help-block"> <b class=&quo ...

  6. java中强,软,弱,虚引用 以及WeakHahMap

    java中强,软,弱,虚引用  以及WeakHahMap   一:强软引用: 参考:http://zhangjunhd.blog.51cto.com/113473/53092/进行分析   packa ...

  7. 利用JavaScript来实现用动态检验密码强度

    平时我们会在某些网站的注册页面或者更改密码的页面发现当我们输入密码时,会有一个类似于进度条的长条进行提示用户输入的密码强度.如下图: 我看到有些人用几张不同的图片来替换,这样似乎可以,但是不太好.所以 ...

  8. js判断密码强度

    html代码: <form name="form1" action=""> 密码:<input type="password&quo ...

  9. 如何在nopcommerce3.3注册页面添加密码强度检查仪？

    我刚刚完成了nopCommerce注册页面的密码强度检查仪,因为我觉得在电子商务交易平台,安全问题是非常重要的.在注册页面有必要添加一个密码强度检测仪,以便通知用户他们的密码是否足够强大.今天,大多数 ...

随机推荐

  1. sql server 2014 序列號

    亲测可用 27HMJ-GH7P9-X2TTB-WPHQC-RG79R

  2. 代码记录——phase16,block32

    HRESULT RotateZoom(PBYTE pbSrc,int iWidth,int iHeight,double dbRotate,double dbZoom,PBYTE pbTag) { / ...

  3. 妙味远程课堂-JS热身运动-上

    希望某个元素移除视线 display:none//显示无 visibility:hidden//可见性 隐藏 width/height 改为0 透明度 定位,left/top值为负值 用与背景颜色一样 ...

  4. Centos7以上的版本 mysql 无法启动，无法停止问题

    service mysqld start 始终提示如下: Failed to issue method call: Unit mysqld.service failed to load: No suc ...

  5. VS2017 Pro未能找到路径“……\bin\roslyn\csc.exe”的解决方案

    VS2017改用roslyn编译的,新的roslyn编译器,支持c# 6.0语法.它放到bin里面去是为了支持asp.net应用的动态编译. 它是通过nuget的包Microsoft.CodeDom. ...

  6. OpenSift源代码编译过程记录

    本文记录了在CentOS6.5上编译Sift的开源实现OpenSift的编译过程,同一时候记录了编译过程中的几个问题. sift的理论已经有非常多了,以下会给出链接: 1.Requirements a ...

  7. IE8兼容性调试及IE 8 css hack

    做网站开发,一提到IE,就会让人头大,有一肚子的牢骚要发:微软为什么不跟着国际标准走呢,总是独树一帜,搞出那么多问题来.IE的firebug调试工具也不太好用,尤其是低版本的IE,更是让人头疼. 最近 ...

  8. 【AI】Ubuntu NVIDIA CUDA CUDNN安装配置

    https://blog.csdn.net/qq_33200967/article/details/80689543 https://blog.csdn.net/sinat_29963957/arti ...

  9. 【AI】卷积

    一 边界补充 1 补零填充 2 边界复制填充 3 镜像填充 4 块填充 二 卷积核 1 平滑均值滤波 2 高斯平滑 3 图像锐化 4 梯度Prewitt 5 Soble边缘检测:垂直梯度水平梯度 6 ...

  10. Nginx 访问日志

    配置访问日志: [root@localhost ~]$ cat /usr/local/nginx/conf/nginx.conf http { log_format main '$remote_add ...