javascript - toLocaleString() 不适用于输入更改

Question

我想在用户输入时为数字添加千位分隔符。这是我的代码:

    $('.rls').on('input',function (e) {
       $(this).val(parseFloat($(this).val()).toLocaleString());
    });

它工作正常，但是当我输入点字符时，它没有在输入中添加点。有什么问题吗？

Answer 1

parseFloat 函数始终删除“.”。所以 toLocalString 将返回不带“.”的数字

您可以检查最后一个字符是否是“.”并将其放回原处。我还添加了对空字符串的检查，否则如果删除所有数字，它将给出 NaN:

$('.rls').on('input',function (e) {
   $this = $(this);
   const val = $this.val();
   if (val === "") {
       return;
   }
   let end = "";
   if (val.charAt(val.length-1) === ".") {
       end = ".";
   }
   $this.val(parseFloat($this.val()).toLocaleString() + end);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input class="rls" />

请记住，某些语言环境使用“，”作为小数点，因此我不确定您的代码是否会在它们上中断。另外，在我的例子中，我的语言环境使用“，”作为千位分隔符，如果我写了一个大于 999 的数字，这会破坏 parseFloat 并删除“，”之后的所有内容。

我认为最好让用户输入他们想要的任何数字，而无需在输入框内书写时更改输入框。