Создание таймера с пользовательским вводом с помощью html и js - PullRequest
Новая
       4

Создание таймера с пользовательским вводом с помощью html и js

0 голосов
/ 16 октября 2019

Я пытаюсь создать простой таймер, похожий на основной Google. Я работал до тех пор, пока не попытался сделать обратный отсчет от значения, введенного пользователем. Я не знаю, почему код больше не работает. Это то, что у меня есть до сих пор: 

<!DOCTYPE HTML>
<html>
  <body>
    <input id="userInput" type="number" defaultValue = "00"/> 
    <p id="timerr"> 00 </p>
    <button onclick="startTime()">Start time</button>
    <button onclick="stop()">Stop time</button>

    <script> 
      var myVar = setInterval(start, 1000);
      var timer = document.getElementbyId("userInput").value;

      function startTime(){ 

        document.getElementById("timerr").innerHTML = timer.value;
        myVar;
      } 

      function start(){
        document.getElementById("timerr").innerHTML = timer.value;
        timer.value--;
        if (timer == -1){
          stop();
          document.getElementById("timerr").innerHTML = "0";  
        }
      }

      function stop(){
        clearInterval(myVar);
      }
    </script>
  </body>
</html>

Я планирую улучшить его, сделав обратный отсчет от минут и часов, но я просто пытаюсь заставить секунды функционировать первыми. Заранее спасибо.

1 Ответ

0 голосов
/ 16 октября 2019

Исходя из вашей текущей структуры кода, ниже приведена рабочая версия. Пожалуйста, проверьте это. 

<!DOCTYPE HTML>
<html>
  <body>
    <input id="userInput" type="number" value = "0"/> 
    <p id="timerr"> 00 </p>
    <button onclick="startTime()">Start time</button>
    <button onclick="stop()">Stop time</button>

    <script> 
      var myVar;
      var timer = document.getElementById("userInput");
      var countDownSeconds;
      function startTime(){ 
        myVar = setInterval(start, 1000);
        document.getElementById("timerr").innerHTML = timer.value;
        countDownSeconds = timer.value;
      } 

      function start(){
        countDownSeconds--;
        document.getElementById("timerr").innerHTML = countDownSeconds;
        if (countDownSeconds == -1){
          stop();
          document.getElementById("timerr").innerHTML = "0";  
        }
      }

      function stop(){
        clearInterval(myVar);
      }
    </script>
  </body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...