Добавление разделителей запятой для значения после вычисления

Question

Расчет, я установил 2 поля ввода, где будет происходить умножение. В текстовые поля можно вводить числа при отображении разделения запятой на значение. Перед умножением я удаляю запятые, а затем передаю результат в текстовое поле 3. Как я могу показать ответ конечному пользователю с разделением запятыми для экземпляра ниже ? Ценю вашу большую помощь.

function calculate() {

  var E1 =   $("#E1").val().split(",").join(""); 
  var E2 =   $("#E2").val().split(",").join("");
  
  var result = E1*E2;
  $("#E3").val(result);
  
}


//For comma seperation
$('input.number').keyup(function(event) {

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

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

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<div class="form-group">
    <label>Value 01</label>
    <input class="form-control number" type="tel" id="E1" required oninput="calculate()" />
</div>

<div class="form-group">
    <label>Value 02</label>
    <input class="form-control number" type="tel" id="E2" required oninput="calculate()" />
</div>

<div class="form-group">
    <label>Value 03 (Result)</label>
    <input class="form-control number" type="tel" id="E3"  />
</div>

Answer 1

Только что добавленная digits функция, эта функция возвращает запятую для каждых трех цифр. Надеюсь, это поможет вам.

function calculate() {

  var E1 = $("#E1").val().split(",").join("");
  var E2 = $("#E2").val().split(",").join("");

  var result = E1 * E2;
  $("#E3").val(result);
  $("#E3").digits();

}

$.fn.digits = function() {
  return this.each(function() {
    $(this).val($(this).val().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,"));
  })
}
//For comma seperation
$('input.number').keyup(function(event) {

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

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

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group">
  <label>Value 01</label>
  <input class="form-control number" type="tel" id="E1" required oninput="calculate()" />
</div>

<div class="form-group">
  <label>Value 02</label>
  <input class="form-control number" type="tel" id="E2" required oninput="calculate()" />
</div>

<div class="form-group">
  <label>Value 03 (Result)</label>
  <input class="form-control number" type="tel" id="E3" />
</div>

Answer 2

function calculate() {

  var E1 =   $("#E1").val().split(",").join(""); 
  var E2 =   $("#E2").val().split(",").join("");

  var result = E1*E2;
  $("#E3").val(result);
  formatNumber($("#E3"))

}

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



//For comma seperation
$('input.number').keyup(function(event) {

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

  formatNumber($(this))
});