javascript - 使用 jQuery/JS 键入时使用 1000 分隔符和 2 个小数位格式化货币输入？

Question

我有一个文本输入，我希望它在输入一个允许 2 个小数位和 1000 个分隔符的值时对其进行格式化。它应该只允许数字。我做了以下但它不允许添加小数点。简单来说就是输入商品(货币)的价格。

INPUT = 1234560ABC.5665 (should only allow numbers)

EXPECTED = 1,234,560.56 (should limit decimal places to 2)

我已经完成了以下操作，但不知道如何添加小数值后跟“.”。固定 ","1000 个分隔符。

<input type="text" id="price" name="price" />

$('#price').keyup(function (event) {
    $(this).val(function (index, value) {
        return '$' + value.replace(/\D/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");
    });
});

Answer 1

我的解决方案使用连续的 .replace

1. .replace(/(?!\.)\D/g, "")删除除 . 之外的所有非数字字符
2. .replace(/(?<=\..*)\./g, "")删除所有额外的 .除了第一个 .
3. .replace(/(?<=\.\d\d).*/g, "")删除小数点后两位数
4. .replace(/\B(?=(\d{3})+(?!\d))/g, ",")在适当的地方插入逗号

我修改了事件以将输入字段的所有更改解释为 .on('change click keyup input paste'

片段:

$('#price').on('change click keyup input paste',(function (event) {
    $(this).val(function (index, value) {
        return '$' + value.replace(/(?!\.)\D/g, "").replace(/(?<=\..*)\./g, "").replace(/(?<=\.\d\d).*/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");
    });
}));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<input type="text" id="price" name="price" />