js使用正規進行密碼強度驗證-js教程-PHP中文網

首頁

web前端

js教程

js使用正規進行密碼強度驗證

php中世界最好的语言

Apr 18, 2018 am 10:24 AM

javascript 密碼強度

這次帶給大家js使用正規則進行密碼強度驗證，js使用正規進行密碼強度驗證的注意事項有哪些，下面就是實戰案例，一起來看一下。

具體程式碼如下：

<!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>

登入後複製

相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

熱AI工具

熱工具

熱門話題

gmail信箱登陸入口在哪裡

7542

CakePHP 教程

1381

steam的賬戶名稱是什麼格式

win11激活密鑰永久

NYT連接提示和答案

Related knowledge

win11提示若要繼續,請輸入管理員使用者名稱和密碼怎麼解決? Apr 11, 2024 am 09:10 AM

當使用Win11系統時，有時會遇到需要輸入管理員使用者名稱和密碼的提示，本文將探討在遇到這種情況時應該如何處理。方法一：1、點選【Windows標誌】，然後按【Shift+重啟】進入安全模式；或這樣進入安全模式：點選開始選單，選擇設定。選擇「更新與安全」；選擇「恢復」中的「立即重新啟動」；重新啟動進入選項後選擇－疑難排解－進階選項－啟動設定—&mdash

如何使用手機設定路由器WiFi密碼（以手機為工具） Apr 24, 2024 pm 06:04 PM

無線網路已成為人們生活中不可或缺的一部分、在當今數位化的世界中。保護個人無線網路的安全性卻顯得格外重要、然而。設定強密碼是確保你的WiFi網路不會被他人入侵的關鍵。保障你的網路安全，本文將詳細介紹如何使用手機修改路由器WiFi密碼。 1.開啟路由器管理頁面-在手機瀏覽器中開啟路由器管理頁面、透過輸入路由器的預設IP位址。 2.輸入管理員使用者名稱和密碼-以獲得存取權限，在登入頁面中輸入正確的管理員使用者名稱和密碼。 3.導覽至無線設定頁面-尋找並點選進入無線設定頁面，在路由器管理頁面中。 4.找到當前Wi

如何為您的Microsoft帳號使用Passkey Feb 19, 2024 am 11:03 AM

Passkey是一種更進階且安全的登入方式，可搭配Microsoft帳號使用。本文將指導您如何在Microsoft帳號中使用Passkey，介紹其優勢以及與密碼的差異。在深入細節之前，我們強調，如果您經常忘記密碼或需要快速登錄，Passkey通常會更適合您。什麼是Passkey？它們與密碼有什麼不同？密碼是一種進階且安全的身份驗證方式，可以取代傳統的密碼登入方式。每個應用程式都有獨特的金鑰，確保安全性，防止網路釣魚等威脅。使用者可以透過電子郵件和密碼確認身份，也可使用臉部辨識、指紋或安全金鑰進行

密碼不正確，小心BitLocker警告 Mar 26, 2024 am 09:41 AM

本文將探討如何解決密碼錯誤的問題，特別是在處理BitLocker警告時需要小心。當在BitLocker中多次輸入錯誤密碼以解鎖磁碟機時，就會觸發這個警告。通常，這個警告出現是因為系統設定了限制錯誤登入嘗試的策略（通常是允許3次登入嘗試）。在這種情況下，使用者會收到相應的警告訊息。完整的警告訊息如下:輸入的密碼不正確，請注意-連續輸入錯誤密碼會導致帳戶被鎖定，這是為了保護您的資料安全。如果需要解鎖帳戶，您將需要使用BitLocker恢復金鑰。密碼不正確，小心BitLocker警告當您登入電腦時收到

如何立即取消Windows 10的鎖定畫面密碼 Jan 09, 2024 pm 03:33 PM

升級了win101909系統後，可能有的朋友會有想要取消自己電腦鎖定畫面密碼的需求。如果不知道該怎麼做的話，小編覺得我們可以在電腦的設定視窗中找到帳號選項，具體方法一起來看看吧。 win101909如何取消鎖定螢幕密碼：1、先按Win+I開啟設定介面。 2、然後找到帳戶--登入選項，再進行如圖設定即可。 win101909取消開機密碼登入的方法：1、在執行中執行regedit開啟登錄檔，定位至下列路徑：HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\WindowsNT\Cu

手機修改wifi密碼教學（簡單操作） Apr 26, 2024 pm 06:25 PM

無線網路已成為我們生活中不可或缺的一部分、隨著網路的快速發展。為了保護個人資訊和網路安全，定期更改wifi密碼是非常重要的、然而。幫助大家更能保護家庭網路安全，本文將為大家介紹如何利用手機修改wifi密碼的詳細教學。 1.了解wifi密碼的重要性wifi密碼是保護個人資訊和網路安全的道防線，在網路時代、了解其重要性可以更好地理解為什麼需要定期修改密碼。 2.確認手機連接到wifi首先確保手機已連接到要修改密碼的wifi網路上，在修改wifi密碼之前。 3.開啟手機設定選單進入手機的設定選單、在手

Win10密碼不符合密碼原則要求咋辦? 電腦密碼不符合政策要求解決方法 Jun 25, 2024 pm 04:59 PM

在Windows10系統中，密碼原則是一套安全性規則，確保使用者設定的密碼符合一定的強度和複雜性要求，而係統提示您的密碼不符合密碼原則要求則通常意味著您的密碼沒有達到微軟設定的複雜度、長度或字元種類的標準，那麼這種情況要如何避免呢？使用者可以直接的找到本地電腦策略下的密碼策略來進行操作就可以了，下面就一起來看看吧。不符合密碼原則規範的解決方法修改密碼長度：根據密碼原則要求，我們可以嘗試增加密碼的長度，例如將原來的6位密碼改為8位或更長。新增特殊字符：密碼策略通常要求包含特殊字符，如@、#、$等。我

win10電腦開機密碼忘了怎麼進入系統_win10電腦忘記開機密碼的處理方法 Mar 28, 2024 pm 02:35 PM

1.在另一台電腦上下載安裝小白一鍵重裝系統工具，插入空u盤製作u盤啟動盤，具體的教程可以參考：2、把U盤啟動盤插到需要更改密碼的電腦重啟，按啟動熱鍵，一般啟動熱鍵為F12、F8、F9、F10、ESC其中一個。接著出現啟動介面，選擇U盤的選項回車進入。 3.選擇【1】啟動win10x64PE按回車確定。 4.選擇桌面上的密碼修改的工具，雙擊開啟。 5.接著出現帳戶名稱列表，選取需要更改密碼的帳戶開啟。 6.點選下方的修改密碼指令，輸入兩次新的密碼，然後點選OK，儲存變更。 7.最後拔掉U盤，重開機就可以正常

See all articles

js使用正規進行密碼強度驗證

熱AI工具

Undresser.AI Undress

AI Clothes Remover

Undress AI Tool

Clothoff.io

AI Hentai Generator

熱門文章

熱工具

記事本++7.3.1

SublimeText3漢化版

禪工作室 13.0.1

Dreamweaver CS6

SublimeText3 Mac版

熱門話題