Как с помощью JavaScript сделать автоматические арифметические вычисления?

Question

[sergeev_bogdan]

Как в JavaScript сделать так, чтобы любые изменения выбранных данных обрабатывались в реальном времени (без дополнительных нажатий кнопок и перезагрузок страницы)?

Язык не знаю, но методом тыка удалось настроить вычисления со значениями выпадающих списков.

Добавил чекбоксы. Пытался задействовать их с помощью if/else в вычислениях, но не получилось. Похоже вообще неправильный путь выбрал.

Подскажите, как сделать так, чтобы в приведенном примере все прибавлялось/перемножалось в реальном времени?

Код: https://codepen.io/sergeev_bogdan/pen/QWbZRgQ

Comments

[insphoto]

я бы сделал объект с данными и на поля навесил бы сеттеры. Что бы при каждом сеттере происходил пересчет итого

Answer 1

[Robur]

Язык не знаю,

тогда самым простым будет сделать функцию "recalculateEverything" и вызывать ее на событие change на всех инпутах

Answer 2

[Rsa97]

$(
  function() {
    function recalculateAll() {
      let res = parseInt($('#myselect_1').val()) 
              + parseInt($('#myselect_2').val());
      $('#outSumOption').text(res);
   
     if ($('#chk1').prop('checked')) {
        res *= 2;
      }
      $('#outSumChk1').text(res);

      if ($('#chk2').prop('checked')) {
        res += 100;
      }
      $('#outSumChk2').text(res);

      $('#outSum').text(res);
    }
  
    $('select, input[type="checkbox"]').change(
      function() {
        recalculateAll(); 
      }
    );
  
    recalculateAll();
  }
);

Comments

[sergeev_bogdan]

Спасибо за помощь!

Answer 3

[xmoonlight]

.on()