input 框输入框限制只能输入数字,类型为字符串 |
您所在的位置：网站首页 › input数字类型 › input 框输入框限制只能输入数字,类型为字符串 |
input 框输入框限制只能输入数字,类型为字符串
|
解决问题一条路行不通要寻找有效的方法，换条思路兴许就解决了。 type="number"输入框只能输入数字 先修改一下样式吧 /*input 框的类型number 去除小箭头*/ input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none !important; } input[type="number"] { -moz-appearance: textfield; } //js 方法 inputhandle(e) { let key = e.key; // 不允许输入'e','.',"+","-" if (key === "e" || key === "." || key === "+" || key === "-") { e.returnValue = false; return false; } return true; },这个方法有缺陷，数字到20+的时候会自动相加，还会变成科学记数法，自动添加小数点 这不是需求，放弃了 解决方案：之前的关注点都在input框上面，使用了各种校验的方法，但第一次如果输入的是非数值，会有一个问题这个值会一直在，即使输入框的值是空值，而且还不能输入其他的值。现在使用的框架是ElementUI ，所以就考虑使用框架属性，校验，竟然成功了，贴代码。（具体的是这个框架的校验可以参考官方文档） prop=“id” :rules=“checkNum” 这是必要的 校验方法 checkNum: [ { validator: (rule, value, callback) => { if (/^[1-9]\d*$/.test(value) == false) { //寻找非数值替换为空值 this.id= this.id.replace( /[^\d]/g, "" ); callback(); } else { callback(); } }, trigger: "change", }, ],结束了！ |
2.输入框只能输入数字 最近的项目需求是：只能在输入框中输入数字，之前解决方式是 οninput=“value=value.replace(/[^\d]/g,’’)”，这个校验是检验是不是数字，不是数字就替换为空值，但是有一个问题就是：再次输入正确的数字，就不能绑定了，一直都是空值。【本文地址】
今日新闻 |
推荐新闻 |