JS 金额正则表达式
在前端开发中,经常会涉及到对用户输入金额的校验和格式化,而正则表达式则是常用的一种方式。本文将会介绍JS中如何使用正则表达式校验和格式化金额输入。
校验金额
目标
校验金额是否符合以下规则:
- 必须为正数
- 只能含有一个小数点
- 小数点后最多两位数
实现
先来看一下JS中如何使用正则表达式:
根据目标规则,可以得出以下正则表达式:
解释一下:
^
开始符号,表示匹配必须从字符串的前面开始\d+
匹配数字字符,+
表示至少匹配一次(\.\d{1,2})?
匹配小数部分,()
表示这部分可有可无,\.
表示匹配小数点,\d{1,2}
表示小数点后最多两位数字$
结束符号,表示匹配必须到字符串的末尾
代码实现:
格式化金额
目标
将输入的金额格式化为每三位逗号分隔,小数点后最多两位
实现
思路:将整数部分和小数部分拆分,分别添加逗号和小数点。
正则表达式的部分解释:
\B
: 表示匹配非单词边界,即不在头或尾,避免类似.4
或0.4
前面重复添加逗号(?=(\d{3})+(?!\d))
: 表示正向预查,匹配后面必须跟三个数字,且不能再跟数字,避免类似1,000,000,0
的情况
结论
本文中介绍了如何使用正则表达式校验和格式化金额输入,关于金额输入还可以考虑使用第三方库或API,以达到更好的体验和安全性。