从 10 开始倒计时，并在计时器反应为 0 时重复

Count down from 10 and repeat it when the timer has reacted 0

本文关键字：计时器 开始 倒计时      更新时间：2023-09-26

我想从 10 秒倒计时到 0。当它达到 0 时，DIV 将重新加载，计时器将重新开始。我有这个函数，可以让它完全按照我想要的方式做，但问题是当倒计时达到 0 并回到 10 时，它将计数 -1 重新加载 -2 重新加载 -3 重新加载 -4 重新加载等等。这不是我想要的！:)

这是我的代码：

var time = setInterval(countdown, 1000);
function countdown() {
    var count = 10;
    countdown = setInterval(function() {
        $('#countdown').html(count + ' sekunder kvar');
        if(count == 0) {
            $('#weather-data').load('jquery-fetch/fetch-weatherdata.php?place=' + myplace);
            clearInterval(countdown);
        }
        count--;
    }, 1000);
}

如何解决我的问题，使计时器从 10 倒计时到 0 并永远重复倒计时？

提前谢谢。

编辑

当此函数第一次达到 0 并重新开始时，它的计数如下所示：10、9、8、10、7、6、5、4、3、2、1、10、9、8、7、10、6、5、4、3、2、1、10、9、8、10、7、6 等等。为什么它使用此代码会像这样工作？

function countdown() {
    var count = 10;
    var timerId = setInterval(function() {
        $('#countdown').html(count + ' sekunder kvar');
        count--;
        if(count == 0) {
            $('#weather-data').load('jquery-fetch/fetch-weatherdata.php?place=' + myplace);
            clearInterval(timerId);
            countdown();
        }
    }, 1000);
}
countdown();

提前感谢！

我在你的脚本中看到了很多问题......所以不确定你是如何让它工作的..

  1. 函数名不能有-，所以调用将不起作用：S
  2. countdown 是function countdown()中的全局变量，与函数名称相同，实际上是countdownception
  3. 当您调用countdown时，您每一秒都在有效地创建新Interval

要实现您想要的，请尝试更简单的方法：

function countdown() {
    // your code goes here
    var count = 10;
    var timerId = setInterval(function() {
        count--;
        console.log(count);
        if(count == 0) {
            // your code goes here
            count = 10;
        }
    }, 1000);
}
countdown();

http://jsfiddle.net/Xrbm5/13/

看看你的代码在做什么。

您正在设置每秒运行的间隔。没关系。

不好的是，每一秒，这个间隔都在创建一个新的间隔，从 10 开始单独倒计时。

此外，您还将countdown设置为全局变量。因此，当你的第一个计数器达到零时，它实际上会清除 LAST 计时器，让第一个计时器愉快地继续变成负数，同时你一直在生成新的间隔。

总的来说，这是一场灾难。

如果您只想每 10 秒更新一次页面，则：

setTimeout(function() {
   // run some code
},10000);

如果要倒计时，则在每个偶数 10 处重置计数器。下面添加了启动和停止功能，它从中断的地方重新统计。此外，如果正在运行，单击"开始"不会启动另一个。

var weatherRefresh = (function() {
  var count = 10;
  var timerRef;
  return {
    start: function() {
      // If already running, leave it running
      if (timerRef) return;
      timerRef = setInterval(function() {
        // Display count
        document.getElementById('dislayedCount').innerHTML = count;
        if (!count--) {
          // count is zero, refresh weather info
          // and start again
          count = 10;
        }
      }, 1000);
    },
    stop: function() {
      timerRef && clearInterval(timerRef);
      timerRef = null;
    }
   };
}());

还有一些按钮可以使其工作（或在页面加载时启动它）：

<button onclick="weatherRefresh.start();">Start</button>
<button onclick="weatherRefresh.stop();">Stop</button>

请注意，该函数大约每秒都会运行一次，如果系统繁忙，它不会按时运行并且会缓慢漂移，但每次不会漂移太多，所以可能无关紧要。

<script>
var timeone = 10;
setInterval(function () {
if (timeone <= 10 && timeone >= 0) { 
document.getElementById("countdown").innerHTML = "Counting down from " + 
timeone; }
if (timeone == 0) { timeone = 11; }
timeone--;
}, 500);
</script>
<div id="countdown"></div>
相关文章：