当前位置: 首页 > news >正文

输入百分比校验(数字非负数保留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];
	}
}

相关文章:

  • ABAQUS圆柱体纤维重力堆积3D模型
  • 关于bug总结记录
  • 软件测试之fiddler详解
  • 计算机二级(C语言)考试高频考点总汇(二)—— 控制流、函数、数组和指针
  • 破解AI焦虑,YonSuite给出了一份企业AI落地路线图
  • 学习日记0327
  • 基于FPGA的ESP8266无线数据传输(温湿度DTH11、光照强度BH1750、WIFI模块)连接中国移动onenet云平台,仿真+上板
  • 数据大屏点亮工业互联网的智慧之眼
  • 材料科学基础:空间群与点群(2)
  • Redis6为什么引入了多线程?
  • TDengine 中的保留关键词
  • 利用新一代雷达传感器增强ADAS系统的检测和计算(TI文档)
  • 深入浅出Qt属性系统:原理、使用与实践
  • 基于SpringBoot的“智慧点餐系统”的设计与实现(源码+数据库+文档+PPT)
  • centos8上实现lvs集群负载均衡nat模式
  • StructuredTaskScope实现原理刨析。
  • 【MySQL】MySQL结构体系及核心组件功能是怎样的?
  • 基于MCP协议的多模态模型优化在医疗3D打印精密人工关节制造中的研究
  • 多onnx模型导出合并调研(文本检测+方向分类+文本识别)
  • 线程对局部变量以及对只能通过当前线程的局部变量才能访问到的对象进行的操作总是线程安全的
  • 做英文网站怎么赚钱/百度推广后台登录入口官网
  • 网站介绍的ppt怎么做/seo顾问服务深圳
  • 开源cms框架/株洲seo
  • hfs网络文件服务器可以做网站/郑州seo哪家专业
  • wordpress怎么改后台/seo有什么作用
  • 石家庄网站建设远策科技/信息流广告是什么