Вычисление суммы значений из трех полей ввода с десятичными числами на JavaScript

Оффтоп javascript
1

Привет, народ! У меня есть задачка с JavaScript, может кто-нибудь помочь? Мне нужно сложить значения из трех полей ввода и показать результат в четвертом. Вот что я хочу сделать:

  1. Есть четыре поля <input>
  2. В первые три вводятся числа
  3. В четвертом должна отображаться их сумма
  4. Числа могут быть дробными

Например, если ввести 2.5, 3.7 и 1.8, то в четвертом поле должно появиться 8.0.

Вот примерная разметка:

<input type="number" id="pole1">
<input type="number" id="pole2"> 
<input type="number" id="pole3">
<input type="number" id="result" readonly>

Как это реализовать на JavaScript? Буду благодарен за помощь!

2

могу поделиться своим опытом, как решать эту задачу на javascript. делал подобное недавно и мой способ был таким: повесь обработчик события input на все три поля, считывай введённые значения и преобразовывай их через parseFloat(), затем сложи полученные числа и округли результат до одного знака после запятой. главное – проверить, что в полях действительно числа, а не какая-то ерунда, чтобы js не завёл себя странно. надеюсь, мой опыт будет полезен и поможет решить задачу!

3

Вот как я бы это сделал: выбираем все инпуты querySelectorAll, вешаем на них addEventListener(‘input’), внутри пробегаемся по инпутам reduce, складывая значения через +parseFloat(input.value || 0). Результат округляем toFixed(1) и записываем в четвертый инпут. Ключевой момент - не забыть про || 0, иначе при пустом поле будет NaN. В целом, задача несложная, главное аккуратно обработать все edge-case’ы.