摘要:日常开发中表单校验几乎离不开正则,本文整理开发高频用到的正则:手机号、身份证、邮箱、金额、账号密码、中文英文等,附带 JS 示例代码,直接复制即可使用。
前言
在前端做表单校验,正则表达式是最高效的手段。比如判断手机号格式、身份证、邮箱、金额、用户名密码、中文输入等场景。下面整理一套业务开发中经常复用的正则,每一条附带注释说明。
完整代码示例
<script>
let inputvalue = ''
//1. 判断是否是正整数
let reg1 = /^[1-9]*$/
console.log(reg1.test(inputvalue))
//2. 手机号码匹配 11位数字
let reg2 = /^1[3-9]\d{9}$/
console.log(reg2.test(inputvalue))
//3. 身份证号匹配(18位)
let reg3 = /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/
console.log(reg3.test(inputvalue))
//4. 邮箱匹配
let reg4 = /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/
console.log(reg4.test(inputvalue))
//5. 金钱匹配(纯数字,保留两位小数)
let reg5 = /^-?0|[1-9]\d*(\.\d{1,2})?$/
console.log(reg5.test(inputvalue))
//6. 匹配中文
let reg6 = /^[\u4e00-\uufa5]+$/
console.log(reg6.test(inputvalue))
//7. 匹配英文
let reg7 = /^[a-zA-Z]+$/
console.log(reg7.test(inputvalue))
//8. 匹配英文和数字
let reg8 = /^[a-zA-Z0-9]+$/
//9. 国内座机号码匹配
let reg9 = /^0\d{2,3}-\d{7,8}$/
//10. 用户账号匹配
/*
* 1.4‑16 位
* 2.只能字母、数字、下划线
* 3.不能以数字开头(必须字母开头)
*/
const reg10 = /^[a-zA-Z][a-zA-Z0-9_]{3,15}$/
console.log(reg10.test('admin 001'))
console.log(reg10.test('001admin'))
console.log(reg10.test('admin!'))
//11.密码强度
/*
* 1.6‑20 位
* 2.必须同时包含:字母 + 数字
*/
const reg11 = /^(?=.*[a-zA-Z])(?=.*\d)[a-zA-Z0-9]{6,20}$/
console.log(reg11.test('admin001'))
console.log(reg11.test('001admin'))
console.log(reg11.test('admin1111'))
/**
* 工具函数:提取字符串里面全部数字
* @param str 原始字符串
* @returns {*} 匹配到的数字数组
*/
function getNum(str) {
let reg = /\d+/g
return str.match(reg)
}
console.log(getNum('订单号:ORD‑2026‑0727'))
console.log(getNum('金额:599元'))
/**
* 判断是否是手机号
* @param str 输入字符串
*/
function isphone(str) {
let reg_result = /^1[3-9]\d{9}$/.test(str)
if (reg_result === true) {
return console.log(`${str} 是手机号`)
} else {
return console.log(`${str} 不是手机号`)
}
}
isphone('18888888888')
isphone('12345678901')
/**
* 判断是否有效邮箱
* @param str 输入字符串
*/
function isemail(str) {
let reg_result = /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/.test(str)
if (reg_result === true) {
return console.log(`${str} 是邮箱`)
} else {
return console.log(`${str} 不是邮箱`)
}
}
isemail('12345678901@163.com')
isemail('invalid‑email')
/**
* 从文本提取全部手机号
* @param str 原始大段文本
* @returns {*} 手机号数组
*/
function gettPhone(str) {
let reg = /1[3-9]\d{9}/g
return console.log(str.match(reg))
}
gettPhone('手机号:18888888888,18888888894,18888888895')
gettPhone('联系13800138001,备用13800138009')
</script>
核心 API 说明
reg.test(str)
返回布尔值 true/false,检测字符串是否满足正则规则,表单校验最常用。
let reg = /^1[3-9]\d{9}$/
let res = reg.test('13800138000')
console.log(res) // true
str.match(reg)
将字符串中匹配到内容提取出来,返回数组,加修饰符
g代表全局匹配。
'abc123def456'.match(/\d+/g) // ["123","456"]
常用正则对照表
表格
| 校验场景 | 正则表达式 | |||||||||
|---|---|---|---|---|---|---|---|---|---|---|
| 手机号 | /^1[3-9]\d{9}$/ |
|||||||||
| 身份证 (18 位) | `/^1-9\d{5}(18 | 19 | (23\d))\d{2}((01-9) | (10 | 11 | 12))((0-21-9) | 10 | 20 | 30 | 31)\d{3}0-9Xx$/` |
| 邮箱 | /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/ |
|||||||||
| 金额(最多两位小数) | `/^-?0 | 1-9\d*(.\d{1,2})?$/` | ||||||||
| 纯中文 | /^[\u4e00-\uufa5]+$/ |
|||||||||
| 账号(字母开头,4‑16 位,字母数字下划线) | /^[a-zA-Z][a-zA-Z0-9_]{3,15}$/ |
|||||||||
| 密码(6‑20 位,字母 + 数字) | /^(?=.*[a-zA-Z])(?=.*\d)[a-zA-Z0-9]{6,20}$/ |
小坑提醒
^代表字符串开头,$代表字符串结尾,表单校验一定要带上,不然部分匹配会绕过校验。- 全局匹配
g修饰符,不要用在test(),会有状态残留问题,提取内容才用g。 - 身份证正则只做格式校验,业务严谨场景还需要后端进一步校验。