elementUI input只能输入数字、小数的几种方法

elementUI input只能输入数字、小数的几种方法
原文链接：https://blog.csdn.net/weixin_42397937/article/details/123297108

elementUI文本框input设置仅可输入数字或者小数的几种方法

一、设置type=“number”

这个属性可以帮助我们限制文本框输入的文本只能是数字或者小数，但是会跟随一个默认的样式，我们需要把默认样式删掉

代码：

<style>
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
input[type="number"] {
  -moz-appearance: textfield;
}
</style>
1
2
3
4
5
6
7
8
9
10

演示样例：

修改之前

修改之后

二、设置oninput属性

代码如下:

oninput ="value=value.replace(/[^0-9.]/g,'')"
1

大概意思就是除了数字0-9的全部替换为’’，改良一下代码，增加输入小数点几位数判断

 oninput="if(isNaN(value)) { value = null } if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)}"
1
2