Web 前端常用正則校驗規則

来源:https://www.cnblogs.com/yuzhihui/archive/2023/05/27/17436413.html
-Advertisement-
Play Games

# Web 前端常用正則校驗規則 作為 Web 前端開發,常用的正則校驗規則有很多。下麵是一些常見的示例: ## 1. 校驗手機號碼 手機號碼的正則表達式可以根據不同國家和地區的手機號碼格式進行調整。以下是中國大陸的手機號碼正則表達式: ```javascript const regex = /^1 ...


Web 前端常用正則校驗規則

作為 Web 前端開發,常用的正則校驗規則有很多。下麵是一些常見的示例:

1. 校驗手機號碼

手機號碼的正則表達式可以根據不同國家和地區的手機號碼格式進行調整。以下是中國大陸的手機號碼正則表達式:

const regex = /^1[3456789]\d{9}$/;

在這個示例中,正則表達式 ^1[3456789]\d{9}$ 表示:

  • ^ 表示匹配字元串的開頭。
  • 1 表示必須以數字 1 開頭。
  • [3456789] 表示第二位必須是 3、4、5、6、7、8 或 9 中的一個。
  • \d{9} 表示後面必須跟著 9 個數字。
  • $ 表示匹配字元串的結尾。

2. 校驗郵箱地址

郵箱地址的正則表達式可以根據不同的郵箱服務提供商進行調整。以下是一個通用的郵箱地址正則表達式:

const regex = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;

在這個示例中,正則表達式 ^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$ 表示:

  • ^ 表示匹配字元串的開頭。
  • \w+ 表示必須以一個或多個字母、數字或下劃線開頭。
  • ([-+.]\w+)* 表示可以包含一個或多個連字元、加號或點號,後面跟著一個或多個字母、數字或下劃線。
  • @ 表示必須包含一個 @ 符號。
  • \w+ 表示必須包含一個或多個字母、數字或下劃線。
  • ([-.]\w+)* 表示可以包含一個或多個連字元或點號,後面跟著一個或多個字母、數字或下劃線。
  • \. 表示必須包含一個點號。
  • \w+ 表示必須包含一個或多個字母、數字或下劃線。

3. 校驗身份證號碼

身份證號碼的正則表達式可以根據不同的國家和地區進行調整。以下是中國大陸身份證號碼的正則表達式:

const regex =
  /^[1-9]\d{5}(19|20)\d{2}(0[1-9]|1[012])(0[1-9]|[12]\d|3[01])\d{3}[0-9Xx]$/;

// 身份證號碼為15位或18位,15位時全為數字,18位前17位為數字,最後一位是校驗位,可能為數字或字元X
// const regex = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;

在這個示例中,正則表達式 ^[1-9]\d{5}(19|20)\d{2}(0[1-9]|1[012])(0[1-9]|[12]\d|3[01])\d{3}[0-9Xx]$ 表示:

  • ^ 表示匹配字元串的開頭。
  • [1-9] 表示第一位必須是 1 到 9 中的一個。
  • \d{5} 表示後面必須跟著 5 個數字。
  • (19|20) 表示第七到第十位必須是 19 或 20。
  • \d{2} 表示第十一到第十二位必須是一個兩位數字。
  • (0[1-9]|1[012]) 表示第十三到第十四位必須是 01 到 12 中的一個。
  • (0[1-9]|[12]\d|3[01]) 表示第十五到第十六位必須是 01 到 31 中的一個。
  • \d{3} 表示第十七到第十九位必須是三個數字。
  • [0-9Xx] 表示最後一位可以是數字或大寫字母 X。

4. 校驗密碼強度

校驗密碼強度通常需要考慮密碼的長度、字元類型和組合方式等因素。以下是一個簡單的密碼強度正則表達式,要求密碼長度為 6 到 20 個字元,且必須包含字母和數字:

const regex = /^(?=.*[0-9])(?=.*[a-zA-Z])([a-zA-Z0-9]{6,20})$/;

在這個示例中,正則表達式 ^(?=.*[0-9])(?=.*[a-zA-Z])([a-zA-Z0-9]{6,20})$ 表示:

  • ^ 表示匹配字元串的開頭。
  • (?=.*[0-9]) 表示必須包含至少一個數字。
  • (?=.*[a-zA-Z]) 表示必須包含至少一個字母。
  • ([a-zA-Z0-9]{6,20}) 表示密碼長度必須為 6 到 20 個字元,且只能包含字母和數字。
  • $ 表示匹配字元串的結尾。

5. 校驗 URL 地址

校驗 URL 地址通常需要考慮 URL 的協議、主機名、埠和路徑等部分。以下是一個簡單的 URL 校驗正則表達式:

const regex = /^(http|https):\/\/([\w-]+\.)+[\w-]+(:\d+)?(\/\S*)?$/;

// const regex =
//   /(((^https?:(?:\/\/)?)(?:[-;:&=\+\$,\w]+@)?[A-Za-z0-9.-]+(?::\d+)?|(?:www.|[-;:&=\+\$,\w]+@)[A-Za-z0-9.-]+)((?:\/[\+~%\/.\w-_]*)?\??(?:[-\+=&;%@.\w_]*)#?(?:[\w]*))?)$/;

在這個示例中,正則表達式 ^(http|https):\/\/([\w-]+\.)+[\w-]+(:\d+)?(\/\S*)?$ 表示:

  • ^ 表示匹配字元串的開頭。
  • (http|https) 表示必須以 http 或 https 開頭。
  • :\/\/ 表示匹配冒號和雙斜杠。
  • ([\w-]+\.)+[\w-]+ 表示匹配主機名,必須包含至少一個連字元或字母,後面跟著一個或多個字母、數字或連字元。
  • (:\d+)? 表示匹配可選的埠號,必須以冒號和一個或多個數字結尾。
  • (\/\S*)? 表示匹配可選的路徑,必須以斜杠開頭,後面可以跟任意非空白字元。
  • $ 表示匹配字元串的結尾。

當然,還有一些其他常用的正則校驗規則,例如:

6. 校驗郵政編碼

郵政編碼的正則表達式可以根據不同的國家和地區進行調整。以下是中國大陸郵政編碼的正則表達式:

const regex = /^[1-9]\d{5}$/;

在這個示例中,正則表達式 ^[1-9]\d{5}$ 表示:

  • ^ 表示匹配字元串的開頭。
  • [1-9] 表示第一位必須是 1 到 9 中的一個。
  • \d{5} 表示後面必須跟著 5 個數字。
  • $ 表示匹配字元串的結尾。

7. 校驗 IP 地址

IP 地址的正則表達式可以根據不同的 IP 地址格式進行調整。以下是一個簡單的 IPv4 地址校驗正則表達式:

const regex =
  /^([01]?\d{1,2}|2[0-4]\d|25[0-5])\.([01]?\d{1,2}|2[0-4]\d|25[0-5])\.([01]?\d{1,2}|2[0-4]\d|25[0-5])\.([01]?\d{1,2}|2[0-4]\d|25[0-5])$/;

在這個示例中,正則表達式 ^([01]?\d{1,2}|2[0-4]\d|25[0-5])\.([01]?\d{1,2}|2[0-4]\d|25[0-5])\.([01]?\d{1,2}|2[0-4]\d|25[0-5])\.([01]?\d{1,2}|2[0-4]\d|25[0-5])$ 表示:

  • ^ 表示匹配字元串的開頭。
  • ([01]?\d{1,2}|2[0-4]\d|25[0-5]) 表示匹配 0 到 255 之間的數字。
  • \. 表示匹配點號。
  • $ 表示匹配字元串的結尾。

8. 校驗護照號碼

以下是中國大陸護照號碼的正則表達式:

const regex = /^[EeGg]\d{8}$/;

在這個示例中,正則表達式 ^[EeGg]\d{8}$ 表示:

  • ^ 表示匹配字元串的開頭。
  • [EeGg] 表示第一位必須是大寫字母 E 或 G,或小寫字母 e 或 g 中的一個。
  • \d{8} 表示後面必須跟著 8 個數字。
  • $ 表示匹配字元串的結尾。

9. 校驗港澳通行證號碼

以下是中國大陸港澳通行證號碼的正則表達式:

const regex = /^[HMhm]\d{8}$/;

在這個示例中,正則表達式 ^[HMhm]\d{8}$ 表示:

  • ^ 表示匹配字元串的開頭。
  • [HMhm] 表示第一位必須是大寫字母 H 或 M,或小寫字母 h 或 m 中的一個。
  • \d{8} 表示後面必須跟著 8 個數字。
  • $ 表示匹配字元串的結尾。

10. 校驗中文名

中文名的正則表達式可以根據具體情況進行調整。以下是一個簡單的中文名校驗正則表達式,要求中文名只包含漢字:

const regex = /^[\u4e00-\u9fa5]{2,4}$/;

在這個示例中,正則表達式 ^[\u4e00-\u9fa5]{2,4}$ 表示:

  • ^ 表示匹配字元串的開頭。
  • [\u4e00-\u9fa5] 表示匹配任意一個漢字。
  • {2,4} 表示匹配 2 到 4 個漢字。
  • $ 表示匹配字元串的結尾。

另外,如果要校驗中文名中是否包含漢字以外的字元,可以使用類似於以下的正則表達式:

const regex = /^[\u4e00-\u9fa5·]{2,20}$/;

在這個示例中,正則表達式 ^[\u4e00-\u9fa5·]{2,20}$ 表示:

  • ^ 表示匹配字元串的開頭。
  • [\u4e00-\u9fa5·] 表示匹配任意一個漢字或中文間隔符 “·”。
  • {2,20} 表示匹配 2 到 20 個漢字或中文間隔符 “·”。
  • $ 表示匹配字元串的結尾。

這個示例中使用了 “·” 作為中文名的間隔符,這是一種常見的方式,但並不是唯一正確的方式。在實際應用中,應根據具體情況選擇合適的間隔符,並根據需要進行調整和優化。

11. 校驗外國人居留證號碼

以下是一個簡單的外國人居留證校驗正則表達式,要求居留證號碼只包含英文字母和數字:

const regex = /^[A-Za-z0-9]{8,20}$/;

在這個示例中,正則表達式 ^[A-Za-z0-9]{8,20}$ 表示:

  • ^ 表示匹配字元串的開頭。
  • [A-Za-z0-9] 表示匹配任意一個英文字母或數字。
  • {8,20} 表示匹配 8 到 20 個英文字母或數字。
  • $ 表示匹配字元串的結尾。

12. 校驗只允許字母和數字

只允許字母和數字的正則表達式如下:

const regex = /^[A-Za-z0-9]+$/;

在這個示例中,正則表達式 ^[A-Za-z0-9]+$ 表示:

  • ^ 表示匹配字元串的開頭。
  • [A-Za-z0-9] 表示匹配任意一個英文字母或數字。
  • + 表示匹配前面的字元至少一次或多次。
  • $ 表示匹配字元串的結尾。

這個正則表達式可以用來校驗只包含字母和數字的字元串,例如用戶名、密碼等。需要註意的是,這個正則表達式不包括空格和其他特殊字元。如果需要校驗包括空格和其他特殊字元的字元串,可以根據具體情況進行調整和優化。

13. 校驗首位不為零的數字

首位不為零的數字的正則表達式如下:

const regex = /^[1-9]\d*$/;

在這個示例中,正則表達式 ^[1-9]\d*$ 表示:

  • ^ 表示匹配字元串的開頭。
  • [1-9] 表示第一位必須是 1 到 9 中的一個。
  • \d* 表示後面可以跟著任意個數字(包括零個數字)。
  • $ 表示匹配字元串的結尾。

這個正則表達式可以用來校驗整數,要求整數的首位必須是 1 到 9 中的一個,可以包含多個數字。此外,這個正則表達式不包括小數和負數,如果需要校驗包括小數和負數的數字,可以根據具體情況進行調整和優化。

需要註意的是,以上示例只是常用的正則校驗規則之一,實際應用中可能需要根據具體的業務需求進行調整和優化。同時,正則表達式的編寫也需要考慮到性能和可讀性等方面的因素。

作者:飛仔FeiZai

出處:https://www.cnblogs.com/yuzhihui/p/17436413.html

聲明:歡迎任何形式的轉載,但請務必註明出處!!!


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 1. 什麼是MAF和MEF? MEF和MEF微軟官方介紹:https://learn.microsoft.com/zh-cn/dotnet/framework/mef/ MEF是輕量化的插件框架,MAF是複雜的插件框架。 因為MAF有進程隔離和程式域隔離可選。我需要插件進程隔離同時快速傳遞數據,最後 ...
  • 有個.NET面試官反饋面試了一個小白,問他用過哪些.NET庫,結果只回答上了幾個。作為一個.NET開發者,瞭解一些常用的.NET庫是非常重要的。本文將介紹.NET開發人員應該瞭解的10個常用.NET庫,這些庫可以幫助開發人員提高開發效率、簡化開發流程,開發出優秀的.NET應用程式。 **1、Auto ...
  • 《機器人SLAM導航核心技術與實戰》第1季:第5章_機器人主機 視頻講解 【第1季】5.第5章_機器人主機-視頻講解 【第1季】5.1.第5章_機器人主機_X86與ARM主機對比-視頻講解 【第1季】5.2.第5章_機器人主機_ARM主機樹莓派3B+-視頻講解 【第1季】5.3.第5章_機器人主機_ ...
  • # shell 常用命令3 ## 1 sed 用來自動編輯文件,可以用來實現替換配置文件的配置 ```shell 語法: sed [-hnV][-e][-f][文本文件] ``` > **參數說明**: > > - -e\或--expression=\ 以選項中指定的script來處理輸入的文本文件 ...
  • 要使用 `systemctl` 啟動單個服務,其中包含多個進程,你可以使用 Systemd 的 `template` 機制。以下是使用 Systemd 'template' 以創建一個可同時啟動多個進程的服務單元文件的過程: 1. 為你的服務創建一個 template 服務單元文件。服務單元文件通常 ...
  • # 欄位類型 | 數據類型 | 位元組 | 範圍 | | | | | |TINYINT|1 位元組|-2^7 + 1 ~ 2^7 - 1| |SMALLINT|2 位元組|-2^15 + 1 ~ 2^15 - 1| |INT|4 位元組|-2^31 + 1 ~ 2^31 - 1| |BIGINT|8 位元組| ...
  • 摘要:條件表達式函數中出現結果集不一致問題,我們首先要考慮是否入參數據類型不一致導致出參不一致。 本文分享自華為雲社區《GaussDB(DWS)條件表達式函數返回錯誤結果集排查》,作者:yd_211369925 。 (一)案例背景 客戶使用greatest獲取並返回參數列表中值最大的表達式的值,子查 ...
  • 好久沒更新博客了,因為工作越來越忙,沒什麼時間去記錄一些問題,最近閑下來一點,由於某些原因不得不暫時在Windows下做開發,項目用到了node-canvas處理圖片什麼的,在安裝的時候各種報錯,確實讓人很抓狂,這裡簡單記錄下: 首先說明下,node-canvas的 官方git倉庫 https:// ...
一周排行
    -Advertisement-
    Play Games
  • 概述:本文代碼示例演示瞭如何在WPF中使用LiveCharts庫創建動態條形圖。通過創建數據模型、ViewModel和在XAML中使用`CartesianChart`控制項,你可以輕鬆實現圖表的數據綁定和動態更新。我將通過清晰的步驟指南包括詳細的中文註釋,幫助你快速理解並應用這一功能。 先上效果: 在 ...
  • openGauss(GaussDB ) openGauss是一款全面友好開放,攜手伙伴共同打造的企業級開源關係型資料庫。openGauss採用木蘭寬鬆許可證v2發行,提供面向多核架構的極致性能、全鏈路的業務、數據安全、基於AI的調優和高效運維的能力。openGauss深度融合華為在資料庫領域多年的研 ...
  • openGauss(GaussDB ) openGauss是一款全面友好開放,攜手伙伴共同打造的企業級開源關係型資料庫。openGauss採用木蘭寬鬆許可證v2發行,提供面向多核架構的極致性能、全鏈路的業務、數據安全、基於AI的調優和高效運維的能力。openGauss深度融合華為在資料庫領域多年的研 ...
  • 概述:本示例演示了在WPF應用程式中實現多語言支持的詳細步驟。通過資源字典和數據綁定,以及使用語言管理器類,應用程式能夠在運行時動態切換語言。這種方法使得多語言支持更加靈活,便於維護,同時提供清晰的代碼結構。 在WPF中實現多語言的一種常見方法是使用資源字典和數據綁定。以下是一個詳細的步驟和示例源代 ...
  • 描述(做一個簡單的記錄): 事件(event)的本質是一個委托;(聲明一個事件: public event TestDelegate eventTest;) 委托(delegate)可以理解為一個符合某種簽名的方法類型;比如:TestDelegate委托的返回數據類型為string,參數為 int和 ...
  • 1、AOT適合場景 Aot適合工具類型的項目使用,優點禁止反編 ,第一次啟動快,業務型項目或者反射多的項目不適合用AOT AOT更新記錄: 實實在在經過實踐的AOT ORM 5.1.4.117 +支持AOT 5.1.4.123 +支持CodeFirst和非同步方法 5.1.4.129-preview1 ...
  • 總說周知,UWP 是運行在沙盒裡面的,所有許可權都有嚴格限制,和沙盒外交互也需要特殊的通道,所以從根本杜絕了 UWP 毒瘤的存在。但是實際上 UWP 只是一個應用模型,本身是沒有什麼許可權管理的,許可權管理全靠 App Container 沙盒控制,如果我們脫離了這個沙盒,UWP 就會放飛自我了。那麼有沒... ...
  • 目錄條款17:讓介面容易被正確使用,不易被誤用(Make interfaces easy to use correctly and hard to use incorrectly)限制類型和值規定能做和不能做的事提供行為一致的介面條款19:設計class猶如設計type(Treat class de ...
  • title: 從零開始:Django項目的創建與配置指南 date: 2024/5/2 18:29:33 updated: 2024/5/2 18:29:33 categories: 後端開發 tags: Django WebDev Python ORM Security Deployment Op ...
  • 1、BOM對象 BOM:Broswer object model,即瀏覽器提供我們開發者在javascript用於操作瀏覽器的對象。 1.1、window對象 視窗方法 // BOM Browser object model 瀏覽器對象模型 // js中最大的一個對象.整個瀏覽器視窗出現的所有東西都 ...