Как сделать вывод посчитанных данных JS

Рейтинг: 0Ответов: 1Опубликовано: 06.02.2023

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

const form = document.getElementById('form');
form.addEventListener('submit', getFormValue);

function getFormValue(event) {
  event.preventDefault();
  var speed = "";
  var interval = "";
  var length = "";
  speed = form.querySelector('[name="v"]'), //получаем поле v
    interval = form.querySelector('[name="interval"]'),
    length = form.querySelector('[name="length"]');
  const data = {
    name: name.value,
    age: age.value,
    plan: plan.value,
    terms: terms.checked
  };
  ps = (length / speed) / interval

  alert(ps);
};
body {
  height: 90%;
}

.avtor {
  margin-bottom: 0px;
}
<body>
  <form>
    <input type="number" name="length"><br>
    <input type="number" name="v"><br>
    <input type="number" name="interval"><br>
    <button type="submit">Посчитать!</button>
  </form>
</body>

<footer>
  <div class="avtor">
    <center></center>
  </div>
</footer>

javascript html
Источник: Stack Overflow на русском

Ответы

▲ 0

Вот исправленный вариант, всего возможного, что можно было исправить.
В комментарий взял data, так как не понятно откуда оно берет значения и так же препятствует работе кода.

const form = document.querySelector(`form#my-form`);
form.addEventListener(`submit`, (event) => {
  event.preventDefault();
  const speed = form.querySelector(`[name="v"]`);
  const interval = form.querySelector(`[name="interval"]`);
  const length = form.querySelector(`[name="length"]`);
  /* const data = {
    name: name.value,
    age: age.value,
    plan: plan.value,
    terms: terms.checked
  }; */
  alert((length.value / speed.value) / interval.value);
});
body {
  height: 90%;
}

.avtor {
  margin-bottom: 0px;
}
<body>
  <form id="my-form">
    <input type="number" name="length"><br>
    <input type="number" name="v"><br>
    <input type="number" name="interval"><br>
    <button type="submit">Посчитать!</button>
  </form>
  <footer>
    <div class="avtor"></div>
  </footer>
</body>