jquery校验复杂强密码的校验正则

封面图片-代码-方图
封面图片-代码-方图

分享一个jquery-javascript校验复杂强密码的校验正则 var pwpattent = /^(?![A-Za-z]+$)(?![A-Z\d]+$)(?![A-Z\W]+$)(?![a-z\d]+$)(?![a-z\W]+$)(?![\d\W]+$)\S{8,}$/;

另外附一个密码强度的表单验证工具源代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
<script src="jquery.min.js"></script>
<script src="jquery.validate.min.js"></script>
<script src="messages_zh.min.js"></script>
<style>
.tbl-txt{font-size:14px;}
        .tbl-txt input{padding:0 5px; height:22px; line-height:22px; margin-bottom:6px;}
        .pw-strength {clear: both;position: relative;top: 8px;width: 180px;}
        .pw-bar{background: url(images/pwd-1.png) no-repeat; position:relative; top:1px;height: 14px;overflow: hidden;width: 179px;}
        .pw-bar-on{background:  url(images/pwd-2.png) no-repeat; width:0px; height:14px;position: absolute;top: 1px;left: 2px;transition: width .5s ease-in;-moz-transition: width .5s ease-in;-webkit-transition: width .5s ease-in;-o-transition: width .5s ease-in;}
        .pw-weak .pw-defule{ width:0px;}
        .pw-weak .pw-bar-on {width: 60px;}
        .pw-medium .pw-bar-on {width: 120px;}
        .pw-strong .pw-bar-on {width: 179px;}
        .pw-txt {padding-top: 2px;width: 180px;overflow: hidden;}
        .pw-txt span {color: #707070;float: left;font-size: 12px;text-align: center;width: 58px;}
 
</style>
<script>
$.validator.setDefaults({
    submitHandler: function() {
      alert("提交事件!");
    }
});
$().ready(function() {
   $('#password').keyup(function () { 
        var strongRegex = new RegExp("^(?=.{8,})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\\W).*$", "g"); 
        var mediumRegex = new RegExp("^(?=.{7,})(((?=.*[A-Z])(?=.*[a-z]))|((?=.*[A-Z])(?=.*[0-9]))|((?=.*[a-z])(?=.*[0-9]))).*$", "g"); 
        var enoughRegex = new RegExp("(?=.{6,}).*", "g"); 
    
        if (false == enoughRegex.test($(this).val())) { 
            $('#level').removeClass('pw-weak'); 
            $('#level').removeClass('pw-medium'); 
            $('#level').removeClass('pw-strong'); 
            $('#level').addClass('pw-defule'); 
             //密码小于六位的时候,密码强度图片都为灰色 
        } 
        else if (strongRegex.test($(this).val())) { 
            $('#level').removeClass('pw-weak'); 
            $('#level').removeClass('pw-medium'); 
            $('#level').removeClass('pw-strong'); 
            $('#level').addClass('pw-strong'); 
             //密码为八位及以上并且字母数字特殊字符三项都包括,强度最强 
        } 
        else if (mediumRegex.test($(this).val())) { 
            $('#level').removeClass('pw-weak'); 
            $('#level').removeClass('pw-medium'); 
            $('#level').removeClass('pw-strong'); 
            $('#level').addClass('pw-medium'); 
             //密码为七位及以上并且字母、数字、特殊字符三项中有两项,强度是中等 
        } 
        else { 
            $('#level').removeClass('pw-weak'); 
            $('#level').removeClass('pw-medium'); 
            $('#level').removeClass('pw-strong'); 
            $('#level').addClass('pw-weak'); 
             //如果密码为6为及以下,就算字母、数字、特殊字符三项都包括,强度也是弱的 
        } 
        return true; 
    }); 
	// 自定义校验规则
   $.validator.addMethod("passwordCheck",function(value, element){  
        var returnVal = false;  
        var chrnum = /^[0-9]*$/;
        return this.optional(element) || (chrnum.test(value));
   },"必须填入数字");  
 
// 在键盘按下并释放及提交后验证提交表单
  $("#signupForm").validate({
	    rules: {
	    
	      username: {
	        required: true,
	        minlength: 2
	      },
	      password: {
	        required: true,
			passwordCheck:true,
	        minlength: 5
	      },
	      confirm_password: {
	        required: true,
	        minlength: 5,
	        equalTo: "#password"
	      } 
	    },
	    messages: {
	    
	      username: {
	        required: "请输入用户名",
	        minlength: "用户名必需由两个字母组成"
	      },
	      password: {
	        required: "请输入密码",
	        minlength: "密码长度不能小于 5 个字母"
	      },
	      confirm_password: {
	        required: "请输入密码",
	        minlength: "密码长度不能小于 5 个字母",
	        equalTo: "两次密码输入不一致"
	      } 
	    }
	});
});
</script>
<style>
.error{
	color:red;
}
</style>
</head>
<body>
<form class="cmxform" id="signupForm" method="get" action="">
  <fieldset>
    <legend>表单</legend>
   
    <p>
      <label for="username">用户名</label>
      <input id="username" name="username" type="text">
    </p>
    <p>
      <label for="password">密码</label>
      <input id="password" name="password" type="password">
    </p>
	 
       <p>
	    
        <div id="level" class="pw-strength">         
            <div class="pw-bar"></div>
            <div class="pw-bar-on"></div>
            <div class="pw-txt">
            <span>弱</span>
            <span>中</span>
            <span>强</span>
            </div>
        </div>   
       </p>
    <p>
      <label for="confirm_password">验证密码</label>
      <input id="confirm_password" name="confirm_password" type="password">
    </p>
   
   
    <p>
      <input class="submit" type="submit" value="提交">
    </p>
  </fieldset>
</form>
</body>
</html>