密码强度及输入合法性校验
Posted liqinzhen
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了密码强度及输入合法性校验相关的知识,希望对你有一定的参考价值。
密码规则:八位以及八位以上, 必须是数字,大小写字母,或者特殊字符四选三。
html代码:
<div class="form-group"> <label class="col-sm-4 control-label is-required">登录密码:</label> <div class="col-sm-8"> <input id = "password" name="password" placeholder="请输入登录密码" class="form-control" type="password" pattern=‘^(?=.*[A-Za-z])(?=.*[!@#$&*])(?=.*[0-9]).{8,}$‘ required> <label style="color:green">密码强度</label> <div style="position: absolute;width: 300px;border:solid 1px;height: 20px;background-color: red;"> <div style="position: absolute;width: 0;height: 20px;background-color: green;" id="green-bar"></div> <span id="str" style="position: absolute;width: 100%;left:0;right: 0;text-align: center;color: white;font-weight: bold;">0%</span> </div> </div> </div>
js代码:
<script> var prefix = ctx + "system/user"; document.getElementById("password").onkeyup = function(){ var val = this.value; var strength = Math.round(password_strength(val)); document.getElementById("green-bar").style.width = strength + "%"; document.getElementById("str").innerText = strength + "%"; }; function password_strength(string){ var h = 0; var size = string.length; var result = {}; string = (‘‘ + string).split(‘‘).sort().join(‘‘).match(/(.)1*/g); for (i = 0; i != string.length; i += 1) { result[string[i].charCodeAt(0)] = string[i].length; } for(var i in result){ var p = result[i] / size; h -= p * Math.log(p) / Math.log(2); } var strength = (h / 4) * 100; if(strength > 100){ strength = 100; } return strength; } //jQuery自定义校验validate jQuery.validator.addMethod("password", function(value, element) {
//正则表达式 var passWord = /^(?=.*[A-Za-z])(?=.*[!@#$&*])(?=.*[0-9]).{8,}$/; return this.optional(element) || (passWord.test(value)); }, "请输入至少8位密码(至少包含1个字母,1个数字和1个特殊字符)"); </script>
效果图:
以上是关于密码强度及输入合法性校验的主要内容,如果未能解决你的问题,请参考以下文章
Django框架进阶7 forms组件(pycharm内置测试环境Python Console), cookie与session操作