在输入类型number中添加千个逗号分隔符

Question

我有这个脚本，StackOverflow的另一个成员，但我需要把逗号分隔数以千计的数字。

我怎么能做到呢?

(function($) {
  $.fn.currencyInput = function() {
    this.each(function() {
      var wrapper = $("<div class='currency-input' />");
      $(this).wrap(wrapper);
      $(this).before("<span class='currency-symbol'>$</span>");
      $(this).change(function() {
        var min = parseFloat($(this).attr("min"));
        var max = parseFloat($(this).attr("max"));
        var value = this.valueAsNumber;
        if(value < min)
          value = min;
        else if(value > max)
          value = max;
        $(this).val(value.toFixed(2)); 
      });
    });
  };
})(jQuery);
$(document).ready(function() {
  $('input.currency').currencyInput();
});

.currency {
  padding-left:12px;
}
.currency-symbol {
  position:absolute;
  padding: 2px 5px;
}

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<input type="number" class="currency" min="0.01" max="2500.00" value="25.00" />

Answer 1

1. 你不能在"number"输入上加逗号，所以把它改成"text"。
2. 因为你不能使用"toLocaleString"和toFixed在一起，一个不同的解决方案是需要的:

(function($) {
  $.fn.currencyInput = function() {
    this.each(function() {
      var wrapper = $("<div class='currency-input' />");
      $(this).wrap(wrapper);
      $(this).before("<span class='currency-symbol'>$</span>");
      $(this).val(parseFloat($(this).val()).toLocaleString(undefined, {minimumFractionDigits:2, maximumFractionDigits:2}));
      
      $(this).change(function() {
        var min = parseFloat($(this).attr("min"));
        var max = parseFloat($(this).attr("max"));
        var value = parseFloat($(this).val().replace(/,/g, ''));
        if(value < min)
          value = min;
        else if(value > max)
          value = max;
        $(this).val(value.toLocaleString(undefined, {minimumFractionDigits:2, maximumFractionDigits:2})); 
      });
    });
  };
})(jQuery);
$(document).ready(function() {
  $('input.currency').currencyInput();
});

.currency {
  padding-left:12px;
}
.currency-symbol {
  position:absolute;
  padding: 2px 5px;
}

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<input type="text" class="currency" min="0.01" max="2500.00" value="1125.00" />