输入百分比校验(数字非负数保留2位不四舍五入)
场景用于输入百分比,限制只能输入非负数,保留2位小数,且不四舍五入
以下举例环境 vue2 + element-ui
请自行根据实际场景使用
html部分
<el-input
v-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);
}
// 开头不能输入多个0
if (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];
}
}