js input 正则保留2位小数中文拼音输入问题 + 限制输入整数的方案

problem

背景

element ui el-input组件
原生input事件

需求

限制输入框的输入
只允许输入数字和小数点
保留2位小数，不允许输入第3位小数

实现

使用 input 原生 oninput 事件
使用 js 正则匹配

// 之前的实现方式
<el-input v-model="dataForm.amount4" placeholder="金额4"oninput="value=value.replace(/^\./g, '0.').match(/\d+\.?\d{0,2}/)"style="width:200px">
</el-input>

问题

在输入中文拼音时，可以阻止其输入
但是会有严重问题：会将之前输入的数字删除
并且：这个问题只有在windows出现，mac系统没有此问题

reason

还不知道原因如果有大佬知道，还请赐教，不胜感激

solution

解决办法：将oninput改为onkeyup事件即可

// 现在实现方式 将 oninput 改为 onkeyup即可
<el-input v-model="dataForm.amount4" placeholder="金额4"onkeyup="value=value.replace(/^\./g, '0.').match(/\d+\.?\d{0,2}/)" style="width:200px">
</el-input>

ps 限制输入整数的方案

<el-input v-model="dataForm.amount5" placeholder="金额5" onkeyup="value=value.match(/\d+/)" style="width:200px">
</el-input>

js input 正则保留2位小数中文拼音输入问题 + 限制输入整数的方案相关推荐

js数字最多保留两位小数_8085微处理器中最多两个8位数字
js数字最多保留两位小数 Problem statement: 问题陈述: To find maximum of two 8bit numberusing 8085 microprocessor. 使 ...
JS中格式化数据保留两位小数
问题:在JS中格式化数据保留两位小数的函数的多种方法最好方法: 保留两位好像是这样吧 var a = 9.39393; alert(a.toFixed(2)); 说明: ...
js设置百分比保留两位小数
CreateTime--2017年8月23日11:03:31 Author:Marydon js设置百分比保留两位小数错误用法: var percent = (num1/num2) * 100%; ...
前端开发：JS中小数点保留两位小数的方法汇总
前言在前端开发过程中,关于数据处理是非常常见的操作了,尤其是处理一些从后台获取到的数据与设计需求的不一样的时候,这就更需要前端来处理拿到的原始数据了.前端关于处理数据的面很多,本篇博文就来分享一下在 ...
js数字处理：保留几位小数,最大值,最小值
js数字处理:保留几位小数,最大值,最小值 function checkDigit(val) {// 调用案例 checkDigit({ number: " 1f发1,a.g5.1A62ag ...
js四舍五入并保留两位小数
js四舍五入并保留两位小数前几天一个月薪35k的兄弟,给我推了一个人工智能学习网站,看了一段时间挺有意思的.包括语音识别.机器翻译等从基础到实战都有,很详细,分享给大家.大家及时保存,说不定啥时候就 ...
JS数据格式化保留两位小数的多种实现方法总结
JS数据格式化是在进行web前端开发时常碰到的事情,特别是在数据类型为Float的数据就需要特殊处理,如保留两位小数.小数点后的数据是否需要四舍五入等等.下面就来介绍实现数据格式化保留两位小数的多种方 ...
JS 格式化价格保留两位小数
由于我用的oracle,数据库定义的价格也是NUMBER(16,2),并且数据也是两位小数,但是查询出来就是一位小数,由于能力有限,所以就在前台处理,方法如下: <script type=&qu ...
js设置input只保留一位小数
前言: input中只保留小数点后一位,直接不让他输入. 实现方法:这里主要用 input事件来监听,vue中的话用 @input input中加上 type='text' *注意这里有坑,不能用数 ...

js input 正则保留2位小数中文拼音输入问题 + 限制输入整数的方案

problem

reason

solution

ps 限制输入整数的方案

js input 正则保留2位小数中文拼音输入问题 + 限制输入整数的方案相关推荐

最新文章

热门文章