vue - 禁止input[number]输入 +、-、e 符号，并且只能输入两位小数

最近写的项目有要求通过键盘输入数字，不能输入 +、- 符号并且只能留两位小数，还有更高的要求：就是只能输入六位数字，控制最多只能输入三位整数，如果输入了四位包括四位以上的整数就要自动给它们加个小数点，变成小数。研究了许久才找到了解决方法，分享给大家参考使用。

一、html代码

<input type="number" v-model="inputVal" @input="changeInput" onkeyup="value=value.replace(/[^\d^\.]+/g,'').replace('.','$#$').replace(/\./g,'').replace('$#$','.')"/>

这里的 onkeyup="value=value.replace(/[^\d^\.]+/g,'').replace('.','$#$').replace(/\./g,'').replace('$#$','.')"这段代码的作用就是不允许输入 +、-、e 。

二、js 代码

 // 监听输入框changeInput() {// 这里是控制小数点后面的个数，这里的是只能输入两位小数let inputVal = this.inputVal.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3');// 这里是控制输入的位数，大于六位就要将第六位之后的清掉if(inputVal.length>6){inputVal=inputVal.slice(0,6);   //  取前六位if(inputVal.indexOf('.')==-1){  // 没有小数点if(inputVal.length>3){// 这里开始做补充小数点的操作let arr = inputVal.toString().split("");arr.splice(3,0,'.');let str = arr.join('');inputVal = parseFloat(str);}}console.log('-----------2222222-------->',inputVal);}else{if(inputVal.indexOf('.')==-1){  // 没有小数点if(inputVal.length>3){let arr = inputVal.toString().split("");arr.splice(3,0,'.');let str = arr.join('');  //ab-cdefinputVal = parseFloat(str);}}console.log('------------11111------->',inputVal);}},

这样就可以实现我们的需求啦！

vue - 禁止input[number]输入 +、-、e 符号，并且只能输入两位小数相关推荐

【VUE实战问题记录】只能输入自然数，包括0及两位小数
// 只能输入自然数,包括0及两位小数const validateProfitNumber = (str) => {return new RegExp('^[0-9]+(.[0-9]{1,2}) ...
el-input 输入框类型；只能输入数字的输入框；保留两位小数输入框；只能输入正整数和0的输入框；手机号正则校验；车牌号码正则校验
以下代码可直接复制使用: 以下代码可直接复制使用! <template><div><a href="https://baike.baidu.com/item/% ...
输入框限制只能输入数字，正数、负数、0，最多两位小数；数字输入框可以输入负数，并最多保留两位小数；el-number-input去掉四舍五入和自动补齐小数；
场景: –要求1:输入框只能输入数字,可以使正数.负数.0,小数点最多保留两位. –要求2:不需要自动补齐小数点,也不需要自动四舍五入. element-ui的数字输入框el-input-number ...
Ubuntu下输入金钱符号时只能输入“₵“无法输入“$“
内核版本:Ubuntu16.04 无法输入"$",写脚本十分麻烦,每次都是别的地方写好复制进来在wiki中对各国货币符号进行搜索,发现加纳塞地的货币符号是"₵" ...
正则表达式来判断输入0-100之间的整数或两位小数的方法
方法一:/^((\d{1,2}(\.\d{1,2})?)|100|100.00)$/ (可以输入0开头的数字,如01,02) 方法二:/^(([1-9]?\d(\.\d{1,2})?)|100|100 ...
vue 保留三位小数_vue input框type=number 保留两位小数自定义组件
第一步:自定义组件MyNumberInput.vue export default { props: { point: { default: 0 }, max: Number, placeholder ...
JS通过正则限制 input 输入框只能输入整数、小数(金额或者现金) 两位小数
第一: 限制只能是整数 ? 1 <input type = "text" name= "number" id = 'number' onkeyup= &q ...
html number输入框限制只能输入正整数或两位小数的正数
限制只能输入两位小数的正数: <label class="col-xs-2 control-label">订单金额:</label> <div cla ...
html:input标签限制输入整数和一位小数、两位小数
(1)整数和一位小数 <input type="number" placeholder="请输入扣分" οnkeyup="value=valu ...
input js number 整数_数字千分位处理，number.js，js保留两位，整数强制保留两位小数...
杨龙飞杨龙飞杨龙飞杨龙飞杨龙飞杨龙飞官方文档:https://www.customd.com/articles/14/jquery-number-format-redux 1.千分位 $. ...

vue - 禁止input[number]输入 +、-、e 符号，并且只能输入两位小数

一、html代码

二、js 代码

vue - 禁止input[number]输入 +、-、e 符号，并且只能输入两位小数相关推荐

最新文章

热门文章