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

以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.

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

相关推荐
Ruihong几秒前
Vue 转 React:揭秘 scoped 样式是如何被 VuReact 编译的?
vue.js·react.js·面试
胖纳特2 分钟前
从零到一:OnlyOffice中国版企业级完整落地指南
前端·后端
MiNG MENS6 分钟前
Spring Boot + Vue 全栈开发实战指南
vue.js·spring boot·后端
Ruihong7 分钟前
Vue 组件样式 <style> 转 React:VuReact 怎么处理?
vue.js·react.js·面试
jrlong7 分钟前
HelloAgents 进阶篇 task03
java·前端·python
搬砖的前端8 分钟前
本地模型+TRAE CN 打造最优模型组合实测:开源主模型+本地辅模型,对标GPT5.2/5.3/Gemini-3-Flash
前端·ai·mac·ai编程·qwen·trae·qwen3.6
userxxcc9 分钟前
Waigo是用“Golang+Web”写的“视图窗口+稳定服务”的桌面端(Win、Mac、Ubuntu)多功能程序基座。开箱即用但有一定上手门槛。
javascript·golang·桌面应用基座·wails3
talen_hx29612 分钟前
飞书机器人发文本消息
java·前端·飞书
freewlt16 分钟前
前端工程化性能监控体系建设:从0到1实战指南
前端
Mintopia17 分钟前
别再一上来就分层:新手最容易做错的系统设计决定
前端