今天温习正则表达式的时候发现一件神奇的事情…
*
前言：在浏览器验证正则字符时，如果输入的是数字带小数点后面不再输入数字，那么浏览器会自动截取掉小数点，即：输入”1.”，浏览器会处理成”1″
唔…因此当我为求方便直接在浏览器中输出表达式时就踩坑了 = =
首先我先写了一个验证最多可保留两位小数的正则：
var reg = /^\d+(.\d{1,2})?$/;
\d：0-9的数字
^\d：以0-9数字开头的表达式
^\d+：以一至多个0-9数字开头的表达式
( )：括号里是一个整体
(.\d{1,2})：. 小数点 、d{1,2} 一至两位数字
(.\d{1,2})?：小数（小数点 + 一至两位小数）限制出现零到一次
(.\d{1,2})?$：若存在小数点，则以小数点后的一至两位小数结尾
在页面中写一个输入框和点击按钮，测试校验是否成功：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<input type="text" id="test" >
<button onclick="review()" id="btn">onclick</button>
<script>
var input = document.getElementById('test');
var reg = /^\d+(.\d{1,2})?$/;
function review(){
console.log(input.value)
console.log(reg.test(input.value))
}
</script>
</body>
</html>
浏览器F12打开控制台查看效果：
可以看到输入框输入1.后正常检验是false，然而如果在浏览器中输入校验规则和字符串则不然：
如果输入个带小数点的数字，后面又不再输入数字时，浏览器会自动忽略掉小数点，因而检验”1.”类似的格式相当于校验“1”，结果自然是true。
仅记录为主，若有什么错误还望包涵指出。
版权声明：本文为weixin_44791115原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。