正则表达式--限制input输入框的相爱相恨(建议收藏)

今天和大家一起研究一下,在工作中我们经常会遇到一些奇怪的input输入需求,比如输入数字输入中文等等,让小伙伴们很头痛。今天勇宝就来和大家一起整理一下工作中常用到的那些正则表达式

模版样例

下面我就干净利索一点,不拖泥带水。我就以element来进行演示

模版样例,下面我只给大家写正则表达式,用法都是一样的。

js 复制代码
<template>
    <el-input v-model="inputVal" @input="hanldeInputRules"></el-input>
</template>

<script setup>
import { ref } from 'vue';

const inputVal = ref('');

const hanldeInputRules = () => {
    const reg = /[^\w_]/g;
    inputVal.value = inputVal.value.replace(reg, '');
}
</script>

常用正则表达式

1. 只能输入大小写字母、数字、下划线

js 复制代码
const reg = /[^\w_]/g;

2. 只能输入小写字母、数字、下划线

js 复制代码
const reg = /[^a-z0-9_]/g;

3. 只能输入中文

js 复制代码
const reg = /[^\u4e00-\u9fa5]/g;

4. 只能输入数字

js 复制代码
const reg = /[^\D]/g;

5. 只能输入英文

js 复制代码
const reg = /[^a-zA-Z]/g;

6. 只能输入中文、数字、英文

js 复制代码
const reg = /[^\w\u4E00-\u9FA5]/g;

7. 只能输入数字和字母

js 复制代码
const reg = /[\W]/g;

8. 只能输入数字和点

js 复制代码
const reg = /[^\d.]/g;

9. 除了英文的标点符号以外,其他的都可以

js 复制代码
const reg = /[^[^!@#$%^&*()-=+]/g;

10. 只能输入英文字母和数字,不能输入中文

js 复制代码
const reg = /[^\w\.\/]/ig;

11. 只能输入数字和英文

js 复制代码
const reg = /[[^\d|chun]/g;

12. 不可输入中文

js 复制代码
const reg = /[\u4E00-\u9FA5]]/g;

13. 不可输入空格

js 复制代码
const reg = /[\s+]/g;

总结

写完正则表达式,搁置几天后,自己都不认识了,今天就先整理这么多把。

相关推荐
学嵌入式的小杨同学1 小时前
从零打造 Linux 终端 MP3 播放器!用 C 语言实现音乐自由
linux·c语言·开发语言·前端·vscode·ci/cd·vim
weixin_425543732 小时前
TRAE CN3.3.25 构建的Electron简易DEMO应用
前端·typescript·electron·vite·nestjs
Mr Xu_2 小时前
【Vue3 + ECharts 实战】正确使用 showLoading、resize 与 dispose 避免内存泄漏
前端·信息可视化·vue·echarts
0思必得03 小时前
[Web自动化] Selenium设置相关执行文件路径
前端·爬虫·python·selenium·自动化
雯0609~3 小时前
hiprint:实现项目部署与打印1-官网提供普通html版本
前端·html
yuezhilangniao3 小时前
AI智能体全栈开发工程化规范 备忘 ~ fastAPI+Next.js
javascript·人工智能·fastapi
不绝1913 小时前
UGUI——进阶篇
前端
Exquisite.4 小时前
企业高性能web服务器(4)
运维·服务器·前端·网络·mysql
铅笔侠_小龙虾4 小时前
Flutter Demo
开发语言·javascript·flutter
2501_944525544 小时前
Flutter for OpenHarmony 个人理财管理App实战 - 账户详情页面
android·java·开发语言·前端·javascript·flutter