При вводе значения в input таймер не делает отчет с этого числа

Question

Написал таймер с возможностью делать отчет с числа, которое выберет пользователь. Появилась проблема, которую я так не смог решить. Если поменять значение input написав туда число и нажать на кнопку, то отчет пойдет он заданного базового значения, а не пользовательского. Не силен еще в js. Прошу о помощи, что не так я сделал

function startTimer() {
  let timeInput = document.getElementById("input-sport").value;
  let time = parseInt(timeInput) * 60;
  //let timerDisplay = document.querySelector('.countdown');
  if (timeInput == 0 || isNaN(timeInput)) {
    alert("error");
  };
  let timer = setInterval(updateTimer, 1000);

  function updateTimer() {
    let minutes = Math.floor(time / 60);
    let seconds = time % 60;
    let minTens = Math.floor(minutes / 10);
    let minOnes = minutes % 10;
    let secTens = Math.floor(seconds / 10);
    let secOnes = seconds % 10;

    const minTensEl = document.getElementById("min_tens");
    const minEl = document.getElementById("min");
    const secTensEl = document.getElementById("sec_tens");
    const secEl = document.getElementById("sec");

    minTensEl.innerHTML = `${minTens}`;
    min.innerHTML = `${minOnes}`;
    secTensEl.innerHTML = `${secTens}`;
    sec.innerHTML = `${secOnes}`;



    if (time <= 0) {
      clearInterval(timer);
    } else {
      time--;
    };


  };

};

document.querySelector('.button').onclick = startTimer();

<form action="" class="timer" onsubmit="submit">
  <div class="info">
    Занимаюсь спортом <input type="number" name="time" aria-label="Число минут" placeholder="0" id="input-sport" value="1"> минут(ы)
    <div class="countdown">
      <div class="num" id="min_tens">0</div>
      <div class="num" id="min">0</div>
      <div class="dots">:</div>
      <div class="num" id="sec_tens">0</div>
      <div class="num" id="sec">0</div>
    </div>
    <button class="button">Запустить</button>
  </div>
</form>

Answer 1

Во-первых надо выкинуть из кода теги form. Зачем они если не используются?

Во-вторых, надо написать не .onclick = startTimer(); а .onclick = startTimer;

БЛОГ НА HUSL

При вводе значения в input таймер не делает отчет с этого числа

Ответы (1 шт):