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

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

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

相关推荐
大阳光男孩9 分钟前
ElementUI表格懒加载子级更新数据刷新不生效问题
前端·javascript·elementui
wy31362282111 分钟前
C#——意框架(结构说明)
前端·javascript·c#
研☆香18 分钟前
JS中的三种显示弹窗
开发语言·前端·javascript
俩毛豆19 分钟前
HarmonyOS APP开发-一文讲清使用Web组件加载网页的三种方法-《精通HarmonyOS NEXT :鸿蒙App开发入门与项目化实战》读者福利
前端·华为·harmonyos
猛扇赵四那边好嘴.24 分钟前
Flutter 框架跨平台鸿蒙开发 - 问答社区应用开发教程
开发语言·javascript·flutter·华为·harmonyos
C_心欲无痕26 分钟前
Next.js 路由系统对比:Pages Router vs App Router
开发语言·前端·javascript
LawrenceLan29 分钟前
Flutter 零基础入门(二十二):Text 文本组件与样式系统
开发语言·前端·flutter·dart
hxjhnct37 分钟前
JavaScript 的 new会发生什么
开发语言·javascript
狗都不学爬虫_42 分钟前
JS逆向 - 最新版某某安全中心滑块验证(wasm设备指纹)
javascript·爬虫·python·网络爬虫·wasm
运筹vivo@44 分钟前
攻防世界:Web_php_unserialize
前端·web安全·php