场景用于输入百分比,限制只能输入非负数,保留2位小数,且不四舍五入
以下举例环境 vue2 + element-ui
请自行根据实际场景使用
html部分
<el-inputv-model="item.percentage"placeholder="请输入"maxlength="5"@input="amountInput(item, 'percentage')"
>
js部分
amountInput(params, key) {// 清除"数字"和"."以外的字符const value = params[key].replace(/[^\d.]/g, '');params[key] = value;// 去除首个.if (value.length > 1 && ['.'].includes(value.substr(0, 1))) {// console.log('==match:', value);params[key] = value.substr(1);}// 保留2位不四舍五入if (value.length > 4 && value.indexOf('.') !== -1) {console.log('==拼装=>', value.split('.')[0], value.split('.')[1].substring(0, 2));params[key] = value.split('.')[0] + '.' + value.split('.')[1].substring(0, 2);}// 如果输入的数字前三位等于100 则不能输入第四位数字if (value.length >= 3 && value.indexOf('.') === -1 && value.substring(0, 3) == '100') {params[key] = value.substring(0, 3);return}// 最大输入100 如果输入的数字大于等于100则第三位不能在输入if (value.length >= 3 && value.indexOf('.') === -1 && value > 100) {params[key] = value.substring(0, 2);}// 开头不能输入多个0if (value.length >= 2 && value.substring(0, 1) == '0' && value.substring(1, 2) != '.') {params[key] = '0';}// 如果开头是一个.直接清空if (params[key] == '.') {params[key] = '';}// 不能输入多个.if (value.split('.').length > 2) {params[key] = value.split('.')[0] + '.' + value.split('.')[1];}
}