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

时间:2014-04-15 15:15:31

标签: javascript jquery html numbers decimal

我正在尝试将逗号添加到输入文本中,该输入文本在输入时允许输入数字。但是也应该允许小数。这是我的数字代码,只是不能算出小数。

$('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/

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

之所以在输入时有自动格式的原因是因为如果你输入一个非常大的数字,你可能会在做这件事时迷路。例如:

  10000000000000000000000000000000000000000000

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

2 个答案:

答案 0 :(得分:7)

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

$('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/

答案 1 :(得分:6)

我认为这可能会做你想要的。 假设:

  1. 只允许用户输入一个小数点。
  2. 小数点后不允许格式化,即逗号。
  3. 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(".");
    }