正则！输入框只能输入数字，正数，保留3位小数，整数部分最长11位

Question

输入框限制只能输入数字，正数，保留3位小数，整数部分最长11位

oninput="value=value.replace(/[^\d{1,11}(\.\d)?$]/g,'')

如题，请问这样为什么不行呢？保留小数三位我在@change里做了

Answer 1

你这样做不合适。应该把“限制输入”和“校验格式”两个逻辑分开做。
比如：

1. 在onInput事件处理函数里只做“限制输入”逻辑，即只准许输入数字和小数点。

   oninput="value=value.replace(/[^\d.]/g,'')"

2. 在onChange或者onBlur事件处理函数里校验输入的数据格式是否正确。

Answer 2

因为正则式只是一种判断规则，它并不限制输入到底是什么，所以用规则式本身其实是不能限定什么的。
正则式用于内容规则限定的正确逻辑是：

1. 接收输入
2. 利用规则式判断输入是否符合
3. 对于符合的反馈符合信息，对于不符合的反馈不符合的信息
4. 根据规则式判定的结果进行后续处理，比如符合的可以继续后续操作，不符合的要求重新输入。

注意4中规则式检验后的后续处理并不是规则式的能力，仅仅是调用规则式处理程序的一种安排。所以楼上把输入限制和格式校验分开是恰当的，当然这里输入限制中其实也可以局部利用规则式加速处理。

此外你的规则式/[^\d{1,11}(\.\d)?$]/g的匹配的是所有不是数字符或{}(),.?的字符，并不是你期望的。

Answer 3

可以都在input中处理，input或者value有两个状态，一个是新值，一个是旧值，用新值去检验是否符合规则，符合规则就赋予新值，否则赋予旧值。分页输入框或模拟的数值输入框基本是这个原理。