Question

下面的函数可以轻松转换为jQuery吗？

并保留调用多个倒计时实例的功能吗？

此函数占用服务器回显的服务器时间，然后倒计时到指定的日期。

CountDownTimer('08/19/2018 10:01 AM', 'countdown');
CountDownTimer('08/20/2017 10:01 AM', 'newcountdown');
var serverTime = new Date('08/08/2017 12:01 AM'); // server time is echoed here
var clientTime = new Date();
var offset = serverTime-clientTime;
console.log(serverTime,clientTime,offset)
function CountDownTimer(dt, id) {
  var end = new Date(dt);

  var _second = 1000;
  var _minute = _second * 60;
  var _hour = _minute * 60;
  var _day = _hour * 24;
  var timer;

  function showRemaining() {
    var now = new Date();
    var distance = end - (now-offset);
    if (distance < 0) {

      clearInterval(timer);
      document.getElementById(id).innerHTML = 'EXPIRED!';

      return;
    }
    var days = Math.floor(distance / _day);
    var hours = Math.floor((distance % _day) / _hour);
    var minutes = Math.floor((distance % _hour) / _minute);
    var seconds = Math.floor((distance % _minute) / _second);

    document.getElementById(id).innerHTML = days + 'days ';
    document.getElementById(id).innerHTML += hours + 'hrs ';
    document.getElementById(id).innerHTML += minutes + 'mins ';
    document.getElementById(id).innerHTML += seconds + 'secs';
  }

  timer = setInterval(showRemaining, 1000);
}

Answer 1

你走了。显然，没有太多变化！仅使用jQuery按ID查找元素。

CountDownTimer('08/19/2018 10:01 AM', 'countdown');
CountDownTimer('08/20/2017 10:01 AM', 'newcountdown');
var serverTime = new Date('08/08/2017 12:01 AM'); // server time is echoed here
var clientTime = new Date();
var offset = serverTime-clientTime;
console.log(serverTime,clientTime,offset)

function CountDownTimer(dt, id) {
  var end = new Date(dt);

  var _second = 1000;
  var _minute = _second * 60;
  var _hour = _minute * 60;
  var _day = _hour * 24;
  var timer;

  function showRemaining() {
    var now = new Date();
    var distance = end - (now-offset);
    var $el = $("#" + id);

    if (distance < 0) {
      clearInterval(timer);
      $el.text("EXPIRED!");

      return;
    }
    var days = Math.floor(distance / _day);
    var hours = Math.floor((distance % _day) / _hour);
    var minutes = Math.floor((distance % _hour) / _minute);
    var seconds = Math.floor((distance % _minute) / _second);

    $el.text(days + 'days ' + hours + 'hrs ' + minutes + 'mins ' + seconds + 'secs');
  }

  timer = setInterval(showRemaining, 1000);
}

JS倒计时脚本到jQuery

1 个答案: