输入框限制输入内容——只能输入数字和小数点

以vue的input为例,需求只能输入数字和小数点

html 复制代码
<el-input @input="money = money.replace(/[^\d|\.]/g, '')" v-model="money" />

原理:通过绑定输入事件 使用replace字符串替换方法修改绑定的值 money就是自己绑定的值

/[^\d|\.]/g 意思是全局匹配除了数字和小数点

replace(/[^\d|\.]/g, '') 就是除了数字和小数点其他都替换为空

.replace方法可以使用多个

html 复制代码
<el-input @input="money = money.replace(/[^\d|\.]/g, '').replace(/^00/g, '0').replace(/^\./g, '0.')" v-model="money" />

除了数字和小数点其他都替换为空 然后以00开头替换为0 以.开头变成0.

有其他需求根据正则表达式 进行修改即可

相关推荐
前端那点事1 分钟前
别再写垃圾组件!Vue3 如何设计「真正可复用」的高质量通用组件
前端·vue.js
卷帘依旧4 分钟前
JavaScript 中的 Symbol
前端·javascript
老王以为8 分钟前
Claude Code 从 GUI 到 TUI:开发者界面的范式回归
前端·人工智能·全栈
JYeontu9 分钟前
正方体翻滚Loading 2.0
前端·javascript·css
llq_35010 分钟前
React 组件处理 Props
前端
夫子39611 分钟前
多人协同后内容丢失?一文搞懂ONLYOFFICE document.key的正确用法
前端
张元清21 分钟前
React 与用户偏好:尊重用户已经在 OS 里设过的那些选项
前端·javascript·面试
RPGMZ22 分钟前
RPGMZ 游戏场景全局提示框 带三秒隐藏插件
前端·javascript·游戏·rpgmz
宠..24 分钟前
VS Code 修改 C++ 标准同时修改错误检测标准
java·linux·开发语言·javascript·c++·python·qt
JarvanMo31 分钟前
2026年最佳Flutter图标包
前端