博客

可以使用如下代码简单地限制 input 输入框只能输入整数或小数：

<input type="text" oninput="this.value=this.value.replace(/[^\d.]/g,'').replace(/(\.\d+)\.+/g, '$1').replace(/(\..*)\./g, '$1')" />

上述代码中，我们使用 `oninput` 事件监听 input 的输入，并在事件处理函数中进行限制。正则表达式 `/[^0-9.]/g` 只允许输入数字和小数点，其余字符会被过滤掉。

然后，使用 `replace()` 方法将输入值格式化为合法的整数或小数。如果输入值包含小数点，则保留前两位小数，其他部分被过滤掉；如果不包含小数点，则直接输出整数。

这样，用户在输入框中输入值时，只有符合要求的数字和小数点能够被输入，不符合要求的字符会被过滤掉。同时，在格式化输入值时，我们也进行了检查，确保其为合法的整数或小数。

具体解释如下：

• 
this.value

  表示当前元素的值。
• 
.replace(/[^\d.]/g,'')

  用空字符串替换所有非数字和非小数点的字符。
• 
.replace(/(\.\d+)\.+/g, '$1')

  将多个连续的小数点替换为一个小数点。这里使用了正则表达式，
  
(\.\d+)

  匹配一个小数点后面跟着一位或多位数字的模式，
  
\.+

  匹配一个或多个小数点的模式，
  
$1

  表示第一个匹配项中的内容。
• .replace(/(\..*)\./g, ‘$1’) 匹配当前值中的第一个小数点后跟任意字符（包括空格），然后再跟一个小数点的模式。通过将第二个小数点替换为匹配项中的内容
  
$1

  ，可以确保只保留第一个小数点。

通过这三步处理，最终得到的值只包含数字和一个小数点，且不会有多余的小数点存在。