Heim > Artikel > Web-Frontend > js verwendet reguläre Ausdrücke zur Überprüfung der Passwortstärke
js verwendet reguläre Ausdrücke zur Überprüfung der Passwortstärke
- php中世界最好的语言Original
- 2018-04-18 10:24:342065Durchsuche
Dieses Mal werde ich Ihnen die Vorsichtsmaßnahmen für die Verwendung regulärer Ausdrücke in js zur Überprüfung der Passwortstärke vorstellen. Hier sind einige praktische Fälle.
Der spezifische Code lautet wie folgt:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>密码强度验证</title>
</head>
<style type="text/css">
body {
background: #ccc;
}
label {
width: 40px;
display: inline-block;
}
span {
color: red;
}
.container {
margin: 100px auto;
width: 400px;
padding: 50px;
line-height: 40px;
border: 1px solid #999;
background: #efefef;
}
span {
margin-left: 30px;
font-size: 12px;
}
.wrong {
color: red
}
.right {
color: green;
}
.strengthLv0 {
height: 6px;
width: 120px;
border: 1px solid #ccc;
padding: 2px;
}
.strengthLv1 {
background: red;
height: 6px;
width: 40px;
border: 1px solid #ccc;
padding: 2px;
}
.strengthLv2 {
background: orange;
height: 6px;
width: 80px;
border: 1px solid #ccc;
padding: 2px;
}
.strengthLv3 {
background: green;
height: 6px;
width: 120px;
border: 1px solid #ccc;
padding: 2px;
}
</style>
<body>
<p class="container">
<label>密码</label>
<input type="text" id="inp1" maxlength="16">
<!--<input type="password" id="inp1" maxlength="16"/>-->
<p class="pass-wrap">
<em>密码强度：</em>
<em id="strength"></em>
<p id="strengthLevel" class="strengthLv0"></p>
</p>
</p>
<script>
var regEx = /^[1-9]\d{4,9}$/; //匹配qq号
//找人
var inp1 = document.getElementById("inp1");
var strength = document.getElementById("strength");
var strengthLevel = document.getElementById("strengthLevel");
var arr = ["", "低", "中", "高"];
inp1.onkeyup = function () {
var level = 0;
if (/[1-9]/.test(this.value)) {
level++;
}
if (/[a-z]/.test(this.value)) {
level++;
}
if (/[^a-z1-9]/.test(this.value)) {
level++
}
if (this.value.length < 6) {
level = 0;
}
strength.innerHTML = arr[level];
strengthLevel.className = "strengthLv" + level;
};
/* inp1.onkeyup = function () {
var level = 0;
if (/[1-9]/.test(this.value)) {
level++;
}
if (/[a-z]/.test(this.value)) {
level++
}
if (/[^a-z0-9]/.test(this.value)) {
level++
}
if (inp1.value.length < 6) {
level = 0;
}
strengthLevel.className = "strengthLv"+level;
strength.innerHTML = arr[level];
};*/
</script>
</body>
</html>
Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!
Empfohlene Lektüre:
Wie Vue ProxyTable das Debugging von schnittstellenübergreifenden Anforderungen implementiert
Wie man die Mongodb-Datenbank in Node.js betreibt
Das obige ist der detaillierte Inhalt vonjs verwendet reguläre Ausdrücke zur Überprüfung der Passwortstärke. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!