小编典典

如何暂停setInterval()函数?

javascript

如何使用Java脚本暂停和恢复setInterval()函数?

例如,也许我有一个秒表来告诉您您浏览网页的秒数。有一个“暂停”和“恢复”按钮。 clearInterval()在此处不起作用
的原因是,如果用户在第40秒和第800毫秒单击“暂停”按钮,则当他单击“恢复”按钮时,经过的秒数必须在之后增加1
200毫秒。如果我在计时器变量上使用clearInterval()函数(单击暂停按钮时),然后在计时器变量上再次使用setInterval()函数(单击恢复按钮时),经过的秒数将增加仅在1000毫秒后返回1,这会破坏秒表的准确性。

那我该怎么做呢?


阅读 2988

收藏
2020-05-01

共1个答案

小编典典

您可以使用标志来跟踪状态:

var output = $('h1');

var isPaused = false;

var time = 0;

var t = window.setInterval(function() {

  if(!isPaused) {

    time++;

    output.text("Seconds: " + time);

  }

}, 1000);



//with jquery

$('.pause').on('click', function(e) {

  e.preventDefault();

  isPaused = true;

});



$('.play').on('click', function(e) {

  e.preventDefault();

  isPaused = false;

});


h1 {

    font-family: Helvetica, Verdana, sans-serif;

    font-size: 12px;

}


<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<h1>Seconds: 0</h1>

<button class="play">Play</button>

<button class="pause">Pause</button>

这就是我要执行的操作,我不确定您是否可以暂停setInterval。

注意:此系统很简单,并且对于不需要高精确度的应用程序非常有效,但是它不会考虑两次滴答之间的时间间隔:如果您在半秒钟后单击暂停,然后单击播放您的时间将关闭半秒钟。

2020-05-01