我正在尝试开发一个网上拍卖。这就是为什么，我需要几个倒计时计时器，用来显示时间，提供是有效的。我使用循环“foreach”函数来表示来自数据库的报价。报价表中有一个字段“validfor”，数据格式为“dd-mm-yyyy”。我找到了在一个页面上使用多个计时器的解决方案，但是在连接数据变量和计时器代码时遇到了困难。问题是我必须手动添加报价的截止日期，我已经在数据库中找到了截止日期。我已经有变量了，但是它们是文本格式的。

必须按以下格式输入报价的截止日期：

var tl = new Date('2018/06/21 18:28:00');
  var t2 = new Date('2018/06/23 10:28:00');

对于下一个计时器，我需要复制一行代码并更改它的id，添加新的截止日期。我只想从数据库中获取数据并进入定时器。
或手动更改div的id:

<div style="margin:5px; font-weight:bold;" id="CDT1" class="CDT"></div>
<div style="margin:5px; font-weight:bold;" id="CDT2" class="CDT"></div>

使用css、javascript和html的定时器的完整视图

计时器的javascript如下：

function CountdownTimer(elm, tl, mes) {
  this.initialize.apply(this, arguments);
}
CountdownTimer.prototype = {
  initialize: function(elm, tl, mes) {
    this.elem = document.getElementById(elm);
    this.tl = tl;
    this.mes = mes;
  },
  countDown: function() {
    var timer = '';
    var today = new Date();
    var day = Math.floor((this.tl - today) / (24 * 60 * 60 * 1000));
    var hour = Math.floor(((this.tl - today) % (24 * 60 * 60 * 1000)) / (60 * 60 * 1000));
    var min = Math.floor(((this.tl - today) % (24 * 60 * 60 * 1000)) / (60 * 1000)) % 60;
    var sec = Math.floor(((this.tl - today) % (24 * 60 * 60 * 1000)) / 1000) % 60 % 60;
    var me = this;

    if ((this.tl - today) > 0) {
      timer += '<span class="number-wrapper"><div class="caption">ДЕНЬ</div><span class="number day">' + day + '</span></span>';
      timer += '<span class="number-wrapper"><div class="caption">ЧАС</div><span class="number hour">' + hour + '</span></span>';
      timer += '<span class="number-wrapper"><div class="caption">МИН</div><span class="number min">' + this.addZero(min) + '</span></span><span class="number-wrapper"><div class="line"></div><div class="caption">СЕК</div><span class="number sec">' + this.addZero(sec) + '</span></span>';
      this.elem.innerHTML = timer;
      tid = setTimeout(function() {
        me.countDown();
      }, 10);
    } else {
      this.elem.innerHTML = this.mes; //sale is over
      return;
    }
  },
  addZero: function(num) {
    return ('0' + num).slice(-2);
  }
}

function CDT() {

  // Set countdown limit
  var tl = new Date('2018/06/21 18:28:00');
  var t2 = new Date('2018/06/23 10:28:00');

  // You can add time's up message here
  var timer1 = new CountdownTimer('CDT1', tl, '<span class="number-wrapper"><div class="line"></div><span class="number end">Акция Закончилась!</span></span>');
  timer1.countDown();
  var timer2 = new CountdownTimer('CDT2', t2, '<span class="number-wrapper"><div class="line"></div><span class="number end">Акция Закончилась!</span></span>');
  timer2.countDown();
}
window.onload = function() {
  CDT();
}

在html中，它如下所示，我必须为不同的计时器输入不同的id，我使用循环“foreach”获取报价：

<div style="margin:5px; font-weight:bold;" id="CDT1" class="CDT"></div>
<br/>
<hr/>
<div style="margin:5px; font-weight:bold;" id="CDT2" class="CDT"></div>