使用 jQuery 和正则表达式的数字输入中的千位分隔符

Question

我需要在这种模式下输入数字：{1-3 numbers} {white-space} {3 numbers} {white-space} {3 numbers} {white-space} .. 等等..

例如，用户输入1000应该转换成1000，而不是输入10000，就会转换成10000；删除最后一个零输入值应返回 1 000

有一个jquery plugin autonumeric，但我只需要这个千位分隔函数

我的代码如下：

$('#myinput').live('keypress', function() {
    if ($(this).val().length == 3){
        newval = $(this).val().replace(/([0-9])([0-9]{2}$)/, '$1 $2');
    }
    if ($(this).val().length == 4){
        newval = $(this).val().replace(/([0-9])([0-9]{3}$)/, '$1 $2');
    }
    ...
    $(this).val(newval);
});

它不能正常工作，还有这个：

newval  = $(this).val().replace(/(\S{1,3})([$0-9]{2})/g, '$1 $2');
newval2 = newval.replace(/([0-9]{1})[\s]([0-9]{1})[\s]/g, '$1$2 ');

这个删除最后一个号码失败

Answer 1

将数字分隔符类添加到您的输入文本元素并将打击代码添加到脚本

<input type="text" class="number-separator" placeholder="Enter Your Number Here...">





jQuery(document).ready(function () {
jQuery(document).on('input', '.number-separator', function (e) {
if (/^[0-9.,]+$/.test($(this).val())) {
  $(this).val(
    parseFloat($(this).val().replace(/,/g, '')).toLocaleString('en')
  );
} else {
  $(this).val(
    $(this)
      .val()
      .substring(0, $(this).val().length - 1)
  );
}});});

您可以在以下位置查看示例： https://www.jqueryscript.net/demo/number-thousand-separator/

Answer 2

编辑：

jsfiddle 上的工作示例

用于光标替换的猴子补丁示例：jsfiddle

---

来自SugarJS的代码

/***
 * @method format([comma] = ',', [period] = '.')
 * @returns String
 * @short Formats the number to a readable string.
 * @extra [comma] is the character used for the thousands separator. [period] is the character used for the decimal point.
 * @example
 *
 *   (56782).format()           -> '56,782'
 *   (4388.43).format()         -> '4,388.43'
 *   (4388.43).format(' ')      -> '4 388.43'
 *   (4388.43).format('.', ',') -> '4.388,43'
 *
 ***/
'format': function(comma, period) {
  comma = comma || ',';
  period = period || '.';
  var split = this.toString().split('.');
  var numeric = split[0];
  var decimal = split.length > 1 ? period + split[1] : '';
  var reg = /(\d+)(\d{3})/;
  while (reg.test(numeric)) {
    numeric = numeric.replace(reg, '$1' + comma + '$2');
  }
  return numeric + decimal;
}

Answer 3

你可以使用：

var str = "1 2345 67 89  11";
str = str.replace(/\D+/g, '');
str = str.replace(/\d(?=(?:\d{3})+(?!\d))/g, '$& ');

http://jsfiddle.net/4Wsqq/ 的示例

这个简单的解决方案不适用于负数和小数。

注意，在 keypress/keydown/keyup 事件中执行此类操作会出现问题。我的主要烦恼是光标位置将移动到末尾，这意味着用户无法在字符串末尾之外的任何其他位置真正输入/更改值。