Question

我只是在学习html和css，并希望添加我在这里找到的javascript代码。此代码基本上从特定的分钟或秒开始倒计时。

以下是代码：

function startTimer(duration, display) {
  var timer = duration,
      minutes, seconds;
  setInterval(function () {
    minutes = parseInt(timer / 60, 10)
    seconds = parseInt(timer % 60, 10);

    minutes = minutes < 10 ? "0" + minutes : minutes;
    seconds = seconds < 10 ? "0" + seconds : seconds;

    display.textContent = minutes + " minutes " + seconds + " seconds";

    if (--timer < 0) {
      timer = duration;
    }
  }, 1000);
}

window.onload = function () {
  var fiveMinutes = 60 * 28.4,
      display = document.querySelector('#time');
  startTimer(fiveMinutes, display);
};

我怎么能多次使用这段代码？具有不同的时间设置。所有在同一页面上。

我在countdown.js文件中有这个代码，效果很好。但如果我试图制作＆＃34; countdown2.js＆＃34;等，并使用它，它不会工作。我改变了＃34;＃time＆＃34;在代码中＆＃34; time2＆＃34;等，并在html代码中做了同样的事。

抱歉说不好。我还不知道javascript，因为我还没有开始学习它。但我真的需要在我的网站上倒计时出现5次，每次都有不同的时间设置。我只能展示一次。

Answer 1

试试这个

window.onload = function () {
  var timer1 = 60 * 28.4,
  display1 = document.querySelector('#time1');
  startTimer(timer1, display1);
  var timer2 = 60 * 28.5,
  display2 = document.querySelector('#time2');
  startTimer(timer2, display2); 
//... Continues
};

输出将分别显示在带有ids time1和time2的标签中。

Javascript倒计时多次出现？

1 个答案: