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

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

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

相关推荐
刘天远2 分钟前
Agent成本核算实现:事件表、状态分布与Python归集
前端·数据库·人工智能·python
欣欣之王来了4 分钟前
开发环境准备:Node.js、npm、VS Code安装配置
前端·学习·架构·项目·vue3教程
xiaolinudao12310 分钟前
将多个 Excel 表格中的数据合并到单个表中|6 种实现方案全解析
java·前端·excel
计算机毕设定制辅导-无忧学长42 分钟前
《校园食堂在线订餐小程序的设计与实现》
java·vue.js·spring boot·微信小程序·uniapp·校园食堂在线订餐小程序
LRL_1 小时前
跨平台 Node 模块安装指南:如何利用 pnpm/npm 配置`supportedArchitectures` 锁定平台依赖
前端·npm·node.js
EatFan1 小时前
React 项目踩坑实录:useEffect 闭包陷阱、Context 性能陷阱与 React 18 升级避坑排查手册
前端·javascript·react.js·react·react hooks·useeffect·闭包陷阱
风骏时光牛马2 小时前
企业业务运营信息数据库
前端
IT_陈寒2 小时前
Vue的数组更新把我坑惨了
前端·人工智能·后端
于航2 小时前
分层上下文压缩,幻觉检测,错误累积概要
前端
数据掘金2 小时前
鸿蒙统计的权限弹窗怎么适配?
前端