Question

我试图让我的输入字段用逗号强制2个小数位，当我按下“5”键六次时，这是一个样本。

我搜索了很多，但我能做的最好的事情是这样的：

       <script type="text/javascript">
       $("#inputID").on('blur change' , function() {       
          $(this).val(parseFloat($(this).val()).toFixed(2))
       }).trigger('blur');
       </script>

有可能吗？

Answer 1

从输入中删除小数点，除以100，然后将其格式化为2位小数。

使用input事件，这样就会在用户输入时发生，而不仅仅是在他们离开输入时。

＆＃13;

$("#inputID").on('blur change input', function() {
  $(this).val(function(i, input) {
    input = input.replace(/\D/g, '');
    return (input / 100).toFixed(2);
  });
}).trigger('blur');

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="inputID">

＆＃13;

Answer 2

如果昏迷是小数分隔符的要求，这是一种方法。

请注意，点在用户输入时也会有效，在模糊时会被更改为昏迷。

＆＃13;

    $("#inputID").on('blur' , function() {       
      var value = parseFloat($(this).val().replace(",","."));
      $(this).val(value.toFixed(2).replace(".",","))
    });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input id="inputID">

＆＃13;

Answer 3

在您更接近（我稍后会再回到）之前，您需要解决几件问题：

您正在使用blur和change事件触发更改，这两项事件都是在文本输入失去焦点后发生的，不是，因为用户正在键入。对于您正在尝试的操作，keyup事件可能是最佳选择（即，释放键盘键时触发的事件）。
您错过了parseFloat($(this).val()).toFixed(2)中的一个步骤。。。你有什么收获价值并将其直接转换为数字（例如，“5”变为5）。要获得所需的行为，您需要做的是将该值除以100（例如，“5”变为0.05）。为此，请将代码更改为：(parseFloat($(this).val()) / 100).toFixed(2)
要获取,而不是.作为小数点分隔符，请对更新后的代码的结果使用字符replace：(parseFloat($(this).val()) / 100).toFixed(2).replace('.', ',')

然而。。

将值更新为输入后，您将遇到几个问题：

众所周知，浏览器与其游标的位置和/或内容的“选择”不一致，这些字段的价值已被系统地更改，并且

一旦您第一次更改了值并将其更新到输入字段，它将完全通过您的计算。例如，“5”更新为“0,05”，因此下次按某个键时，您将真正输入“0,0055”，这将导致“0.00”

当然有很多方法可以解决这些问题，但是在你最终获得跨浏览器兼容的东西之前，它们会给你带来很多麻烦（这会有所不同，具体取决于你想要支持哪些浏览器）。如果可以选择，您可能需要考虑坚持使用“后加入”blur / change方法。

格式输入强制2位小数

3 个答案: