时间戳

首页 > 解决方案 > 在输入货币时如何格式化字段但支持退格和编辑？

javascript - 在输入货币时如何格式化字段但支持退格和编辑？

问题描述

我喜欢下面的这个功能，它非常适合在您键入时格式化美元，但是，我无法弄清楚光标重新定位的问题，因为它与使用退格或突出显示并替换多个数字有关一次。例如，如果您运行被截断的代码，请尝试使用退格键将数字中的“32”替换为“89”或突出显示它并在上面输入。

有没有办法支持这一点？也许用光标重新定位？

$(document).ready(function() {
  $(this).on('click keyup paste', 'input.dollar:not([readonly])', function(e) {
    if (e.which != 8) {
      var par = $(this).parents('.listingbox');
      // skip for arrow keys
      if (e.which >= 37 && e.which <= 40) return;
      // format number

      $(this).val(function(index, value) {
        var $ret = value.replace(/\D/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");
        return '$' + $ret;
      });
    }
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<input class="dollar" value="$342,323,123" />

标签： javascriptjquery

解决方案

我建议写一个供你自己使用。需要记住的一些事项：

  • 应该只取数字
  • $ 符号应该只出现在开头
  • 输入数字时应弹出逗号（从右开始每 3 位）
  • 不确定是否允许小数

记住这一点，我们可以onchange在输入元素上编写一个触发器。

让我知道其他人的想法。

推荐阅读