Jquery在键入时添加逗号以输入带小数的数字

Question

我正在尝试在输入文本中添加逗号，以便在输入时允许输入数字。但也应该允许小数。这是我的数字代码，只是无法计算出小数点。

$('input.number').keyup(function(event) {

  // skip for arrow keys
  if(event.which >= 37 && event.which <= 40){
   event.preventDefault();
  }

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

如果有人有一个很棒的解决方案，那就太好了。

小提琴： http://jsfiddle.net/yWTLk/348/

更新：一些不错的 cmets，但也许任何人都可以想到一种方法来输入可编辑的文本字段，同时用逗号格式化您的数字并尊重小数。有人告诉我这样做几乎是不可能的，但让我们看看是否有人能想到解决方案。

打字时自动格式化的原因是如果你输入一个非常大的数字，你可能会在输入时迷路。例如：

  10000000000000000000000000000000000000000000

正确输入将是一场噩梦，因此自动格式会告诉您您是否丢失或不是零。另一方面，之后验证它会向您显示错误，也许是的，您可以纠正它，但这是一个额外的步骤。

Answer 1

可以这样做，但我会做的是在输入字段之外的其他地方显示逗号分隔的数字。

$('input.number').keyup(function(event) {

  // skip for arrow keys
  if(event.which >= 37 && event.which <= 40){
   event.preventDefault();
  }

  $(this).val(function(index, value) {
      value = value.replace(/,/g,''); // remove commas from existing input
      return numberWithCommas(value); // add commas back in
  });
});

function numberWithCommas(x) {
    var parts = x.toString().split(".");
    parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
    return parts.join(".");
}

http://jsfiddle.net/jpAmE/

Answer 2

我认为这可能会满足您的需求。 假设：

1. 用户只能输入一位小数。
2. 小数点后不允许使用任何格式，即逗号。

Fiddle

$('input.number').keyup(function (event) {
    // skip for arrow keys
    if (event.which >= 37 && event.which <= 40) {
        event.preventDefault();
    }

    var currentVal = $(this).val();
    var testDecimal = testDecimals(currentVal);
    if (testDecimal.length > 1) {
        console.log("You cannot enter more than one decimal point");
        currentVal = currentVal.slice(0, -1);
    }
    $(this).val(replaceCommas(currentVal));
});

function testDecimals(currentVal) {
    var count;
    currentVal.match(/\./g) === null ? count = 0 : count = currentVal.match(/\./g);
    return count;
}

function replaceCommas(yourNumber) {
    var components = yourNumber.toString().split(".");
    if (components.length === 1)
        components[0] = yourNumber;
    components[0] = components[0].replace(/\D/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");
    if (components.length === 2)
        components[1] = components[1].replace(/\D/g, "");
    return components.join(".");
}