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

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

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

相关推荐
JYeontu几秒前
开箱流水加载动画
前端·javascript·css
RANxy1 分钟前
AntV 入门系列:G6 图可视化实战
前端
尽欢i3 分钟前
Vue3 customRef 封神教程:防抖、本地存储、自动埋点一套搞定,模板干干净净
前端·javascript·vue.js
VOLUN6 分钟前
TypeScript封装通用RESTful BaseAPI,后台接口代码精简80%
前端·javascript
胡永双6 分钟前
Hexo + GitHub Pages搭建个人Blog教程(三)
前端
hunterandroid9 分钟前
[Android 从零到一] 权限管理:运行时权限与最佳实践
前端
kyrie2811 分钟前
Redux 完整基础操作(原生 Redux,不结合 React-Redux)
前端
因_崔斯汀12 分钟前
Vue 模板编译:HTML 是怎么变成 JS 的?
前端·vue.js
UXbot25 分钟前
帮助企业低门槛开展AI应用开发的平台推荐
前端·低代码·ui·交互·产品经理·原型模式·web app