Question

我使用final countdown来倒计时。我提供了一个enddate，它很好用。

<div class="js-countdown" data-enddate="2019/1/21 15:54"></div>

我的js：

var $clock = $('.js-countdown');
var d = new Date(Date.parse($clock.data("enddate").replace(/ /g, "T")));
  $clock.countdown(d, function(event) {
    $(this).text(
      event.strftime('%D days %H:%M:%S')
    );
  });
</script>

这实际上取决于用户时钟，例如，当用户更改时间或时钟未同步时，倒数计时器将无法正常工作。
服务器时间：13：54
用户时间：13:54
结束日期：15:54，然后倒计时显示： 2（小时）：00（分钟）。但是如果：
服务器时间：13：54
用户时间：14：54（故意更改）
结束日期：15:54，然后倒数显示 1（hrs）：00（mins），因为我希望它是 2（hrs）：00（mins）。我该如何改变这种行为？我的目标是实现一个独立的倒数计时器。您能给我提示吗？

编辑

Here，计时器更新日期。每次更新事件触发时发送请求是否合理？

Answer 1

我不确定这是否是最好的方法，但是到目前为止，它可以正常工作。

var now;
var it = 1;
now = new Date(Date.parse('@DateTime.UtcNow.ToString("u")'.replace(/ /g, "T")));
setInterval(setAndSyncTime, 1000);
function setAndSyncTime() {
    var t1 = new Date();
    var t2 = now;
    var t3 = Math.abs(t1 - t2);
    if (t3 > 2000) {
        if (it === 10) {
            it = 0;
            $.ajax({
                url: '/SyncTime',
                type: 'get',
                success: function (response) {
                    now = new Date(Date.parse(response.replace(/ /g, "T")));
                }
            });
        } else {
            now = now.setSeconds(now.getSeconds() + 1);
            now = new Date(now);
        }
    } else {
        now = now.setSeconds(now.getSeconds() + 1);
        now = new Date(now);
    }
    it++;
}

和

public virtual JsonResult SyncTime()
{
    return Json(DateTime.UtcNow.ToString("u"), JsonRequestBehavior.AllowGet);
}

JavaScript中的独立倒计时

编辑

1 个答案: