я хочу отобразить счетчик на экране, используя внутренний HTML, но он не работает в al oop, даже когда я использую функцию сна? - PullRequest
Новая
       9

я хочу отобразить счетчик на экране, используя внутренний HTML, но он не работает в al oop, даже когда я использую функцию сна?

0 голосов
/ 24 апреля 2020

на самом деле я хочу таймер, чтобы можно было вести обратный отсчет от желаемого диапазона до 0, но с помощью внутреннего HTML просто отображает 0:00 сразу, не показывая изменений. Я использовал функцию сна, так что теперь экран просто остается прежним, а затем отображает ноль и не как обратный отсчет что делать? помогите !!! 

function sleep(t){
   let timeenter code hereStart=new Date().getTime();
     while(true)
      {
       let elapsedTime=new Date().getTime()-timeStart;
       if(elapsedTime>t){
       break;
      }
    }
}

function startLoop(){

  let v1=document.getElementById("minutes-input").value;
  let v2=document.getElementById("seconds-input").value;
  let x1=document.getElementById("minutes");
  let x2=document.getElementById("seconds");

for(var i=0;i<v1;i++)
{
  x1.innerHTML=i;
  console.log(i);
  for (var j =1; j<=59; j++) {
     sleep(1000);
    x2.innerHTML=j;
    console.log(j);
  }
}

1 Ответ

0 голосов
/ 25 апреля 2020

Посмотрите, поможет ли это. Я знаю, что CSS должно быть во внешнем файле, но эй .... Итак, вот оно ... 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

<input type="text" id="minutes-input" value="1">
<input type="text" id="seconds-input" value="10">
<div style="border: 2px solid black; width: 100px; height: 15px;" id="minutes"></div>
<div style="border: 2px solid black; width: 100px; height: 15px;" id="seconds"></div>
<button type="button" onclick="setInterval(updateTime, 1000);">Start counting</button>

<script>
let v1=document.getElementById("minutes-input").value;
let v2=document.getElementById("seconds-input").value;
let x1=document.getElementById("minutes");
let x2=document.getElementById("seconds");

x1.innerHTML = v1;   // starting time in minutes
x2.innerHTML = v2;   // starting time in seconds

function updateTime() {
    x1.innerHTML = v1;
    if(v2 > 0) {
        x2.innerHTML = --v2;
        if(v1 === 0 && v2 === 0) {
          return;                    // stop counting
        }
        if(v2 === 0) {
            v2 = 60
            v1--;
        }
    }  
}
</script>
</body>
</html>

Если мне нужно что-то объяснить, просто спросите ...

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...