Как остановить таймер через десять секунд в javascript, используя setInterval и clearInterval?

Мне было интересно, как я могу остановить таймер через десять секунд в javascript, используя setInterval и clearInterval ?? Вот мой пример кода, не могли бы вы сказать мне, где я ошибаюсь:

<!DOCTYPE html>
<html>
<head>
<script>

var tt=setInterval(function(){startTime()},1000);


function startTime()
{
  var today = new Date();
  var h=today.getHours();
  var m=today.getMinutes();
  var s=today.getSeconds();
  // add a zero in front of numbers<10
  m=checkTime(m);
  s=checkTime(s);
  today=checkTime(today);
  document.getElementById('txt').innerHTML=s;

}

function checkTime(tt)
{
if (tt==10)
  {
    tt="0" + tt;
    console.log(tt);
    clearInterval(tt);
  }
return tt;
}
</script>
</head>

<body onload="startTime()">
<div id="txt"></div>
</body>
</html>

javascript timer setinterval clearinterval settimeout
person Formula 1    schedule 10.09.2013    source источник
comment
Изгиб времени-пространства не совсем работает для тебя, ага :P...   -  person UIlrvnd    schedule 10.09.2013
comment
Ваш код не имеет смысла! checkTime вызывается с тремя разными значениями?   -  person epascarello    schedule 10.09.2013
comment
Подумайте, насколько setInterval может быть опасен, если выполнение вашей функции занимает больше времени, чем заданный интервал.   -  person Paul S.    schedule 10.09.2013

Ответы (5)


arrow_upward
5
arrow_downward

Поскольку startTime() будет запускаться каждую секунду, сделайте внутри него счетчик, увеличивающий значение до 10, а затем очистите интервал.

var tt=setInterval(function(){startTime()},1000);
var counter = 1;

function startTime()
{
  if(counter == 10) {
    clearInterval(tt);
  } else {
    counter++;
  }

  document.getElementById('txt').innerHTML= counter;  
}

JSFiddle

person Tricky12    schedule 10.09.2013

arrow_upward
15
arrow_downward

вы можете установить тайм-аут на очистку, как это сразу после установки интервала:

var tt = setInterval(function(){ startTime() }, 1000);
setTimeout(function() { clearInterval(tt); }, 10000);
person Tomzan    schedule 10.09.2013
comment
Я не знаю почему, но за этот ответ проголосовали против, хотя это самый простой ответ из всех, и он работает. Он устанавливает интервал и очищает его через 10 секунд. Это именно то, что он должен делать. - person Butt4cak3; 10.09.2013

arrow_upward
3
arrow_downward

Поскольку вы назвали локальную переменную именем tt, что не позволяет вам получить доступ к глобальной переменной tt. Очень плохое планирование имен переменных.

Ваш код также не остановится на 10 секундах, он остановится, когда время будет 10 секунд или 10 минут.

function checkTime(xtt)
{
if (xtt==10)
  {
    xtt="0" + xtt;
    console.log(xtt);
    clearInterval(tt);
  }
return xtt;
}
person epascarello    schedule 10.09.2013
comment
Хороший улов (я думаю - едва могу прочитать материал), не могли бы вы ответить на следующий вопрос: P? - person UIlrvnd; 10.09.2013

arrow_upward
3
arrow_downward

Это работает для меня.

var tt = setInterval(function(){ startTime() }, 1000);

setTimeout(function() { clearInterval(tt); }, 10000);
person Sayid Dastaan    schedule 19.08.2016
comment
Если вы хотите поблагодарить Томзана за его ответ, вы должны проголосовать за него, а не добавлять ответ. - person andrewsi; 26.08.2016
comment
Как уже отмечалось ранее, это точная копия приведенного выше ответа. - person Luis David; 05.10.2019

arrow_upward
0
arrow_downward

Вы можете сделать это

setInterval(startTime, 1000).pipe(takeUntil(timer(10000)));
person itai schwed    schedule 03.05.2020