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

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

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

相关推荐
i220818 Faiz Ul2 分钟前
二手交易系统|基于springboot + vue二手交易系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·论文·毕设·二手交易系统
yingyima8 分钟前
Git 实战:你必须掌握的 7 个常用命令
前端
gjwjuejin8 分钟前
前端埋点不头秃:从打点代码到数据分析的完整实战
javascript
Schafferyy18 分钟前
【vue3】Form表单重置不生效
javascript·vue.js
次次皮19 分钟前
代理启动前端dist包
java·前端·vue
星恒随风1 小时前
四天学完前端基础三件套(JavaScript篇)
开发语言·前端·javascript·笔记
guslegend1 小时前
第9节:前端工程与一键启动
前端·大模型·状态模式·ai编程
杜子不疼.2 小时前
【 C++ AI 大模型接入 SDK】 - 日志模块
开发语言·javascript·c++
南囝coding2 小时前
Anthropic 内部数百个 Claude Code Skills,他们总结的这套方法值得看
前端·后端
Dxy12393102162 小时前
如何使用jQuery获取一类元素并遍历它们
前端·javascript·jquery