在fomat 00.00中接受数字的正则表达式

Question

在我的角应用程序中，我试图对输入字段设置验证，例如

它应该只接受2位数字或浮点数，并有2位后点和前点。

示例

接受价值

3、33、33.3、33.33

最大值可达99.99

不接受

333 33.333 3.333 333.33

目前我正在使用

pattern="[+]?((\d{1,2})+(?:[\.][0-9]{0,2})?|\.[0-9]{0,2})$"

它一次又一次地验证2位数，但由于它接受333.33 (这是错误的)，所以无法在点前验证两位数。

我也试过

pattern="[+]?(([0-9])+(?:[\.][0-9]{0,2})?|\.[0-9]{0,2})$"

但是同样的事情发生了，它不会在点前验证两位数。

Answer 1

此模式(\d{1,2})+将匹配1-2位数字，并将重复一次或多次.

像\.[0-9]{0,2}这样的模式也只匹配一个点，因为数字将匹配0-2次。

可以使用锚点来断言字符串的start ^和end $。将1或2位数字与匹配点和1或2位数的可选部分相匹配：

^\d{1,2}(?:\.\d{1,2})?$

Regex演示

解释

• ^断言字符串的开始
• \d{1,2}匹配数字1或2次
• (?: 非捕获组
  • \.\d{1,2}匹配一个点和1或2位数字

​

• )?关闭非捕获组并使其成为可选的
• $断言字符串的结尾

如果要在开头匹配可选加号，则正则表达式的开头可以是^\+?。

​

let pattern = /^\d{1,2}(?:\.\d{1,2})?$/;
let strs = [
  "99",
  "3",
  "33",
  "33.3",
  "33.33",
  "333",
  "33.333",
  "3.333",
  "333.33"
];

strs.forEach((s) => {
  console.log(s + " ==> " + pattern.test(s));
});

​

Answer 2

在我看来，正则表达式可以简化。你真的想要一个可选的领导"+“吗？我忽略了它，因为你的例子不包括它，如果你想要的话，把它放回去。

​

function testValue(){
  // Optional leading +
  // var re = /^\+?\d{1,2}(\.\d{1,2})?$/;
  // No leading +
  var re = /^\d{1,2}(\.\d{1,2})?$/;
  console.log(re.test(this.value));
}


window.onload = function(){
  document.querySelector('input').addEventListener('input',testValue,false);
}

Enter number: <input>

​