使用 JavaScript 验证金额字段

validate amount field using javascript

本文关键字：字段 金额 验证 JavaScript 使用      更新时间：2023-09-26

我一直在到处寻找解决方案，但没有一个安静符合我的标准。

我想使用户能够输入任何正数（可选的 2 位小数位，用点"."分隔）

即： 1.23， 12.23， 123.23，

1234.23， 1， 0

我该怎么做？

我试图使用这个正则表达式 

$('form').submit(function(){
        var amount = $('#amount');
        var regex = new RegExp("^'d+('.'d{1,2})?$");
        var error = 0;
        if(amount.val() == '' || amount.val() <= 0 || regex.test(amount.val()) == false){
            $('label', amount.parent()).addClass('error');
            error++;
        }else{
            $('label', amount.parent()).removeClass('error');
        }
        if(error > 0){
            return false;
        }
    });

我对正则表达式不是很有经验，并尝试使用我通过搜索找到的上面的代码，但它似乎不起作用，我不知道为什么。 我不确定这是正则表达式中的错误还是我使用它的方式。

使用 var regex = new RegExp("^[-+]?'d+('.'d'd?)?$"); 表示 2 位小数（第 1 位必填，第 2 位非）。

像这样：

^'d+('.'d{1,2})?$

请注意，我们[-+]?删除了符号部分，因为您只陈述了正数。

解释： 

^             start of string
'd+           match zero or more digits
('.'d{0,2})?  match the pattern in the brackets 0 or 1 time
'.            match a literal .
'd{1,2)       match 1 or 2 digits
$             end of string

因此，这允许一些数字可以选择后跟一个.和 1 或 2 个数字。根据需要进行调整。

var rx = /^'d+('.'d{1,2})?$/;
alert(rx.test("1.22") + "'n"         // true
      + rx.test("10") + "'n"         // true
      + rx.test("2223.4") + "'n"     // true
      + rx.test("foo") + "'n"        // false
      + rx.test("1..22") + "'n"      // false
     + rx.test(" 1"));               // false

您发布的正则表达式允许任意数量的小数位。这个只允许 2 位小数

var regex = new RegExp("^[-+]?'d+('.'d'd?)?$");

它又长又丑，我不记得我最初从哪里得到它，但这是我使用的那个（它也验证了正确的逗号分隔，并允许在开头使用可选的 $）：

var regex = /^'$?(([1-9][0-9]{0,2}(,[0-9]{3})*)|[0-9]+)?(.[0-9]{2})?$/;

这是一个工作小提琴：http://jsfiddle.net/5v9zcxrm/5/

对于我使用的小数位（.[0-9]{2}） 仅验证 2 位小数或零。如果要允许一个小数位使用： 

var regex = /^'$?(([1-9][0-9]{0,2}(,[0-9]{3})*)|[0-9]+)?(.[0-9]{1,2})?$/;

如果您只需要数字（不带逗号）和可能的小数位数为一位或两位数字，请使用：

var regex = /^'d+(.[0-9]{1,2})?$/;

$('form').submit(function(){
        var amount = $('#amount');
        var regex = /^'d+('.'d{2,2})?$/;
        var error = 0;
        if(amount.val() == '' || amount.val() <= 0 || regex.test(amount.val()) == false){
            $('label', amount.parent()).addClass('error');
            error++;
        }else{
            $('label', amount.parent()).removeClass('error');
        }
        if(error > 0){
            return false;
        }
    });

这是我更新的解决方案，可以按预期工作。 特别感谢马特·伯兰德和所有使这成为可能的人

相关文章：