2

我正在尝试查找两个日期（和时间）之间的日期和时间差。我正在尝试实现倒计时（到事件日期）功能，但遇到了我的方法的问题。

注意：下面定义的一些变量在，只要它们在同一个文件中HuBL，HuBL就可以使用。Javascript

这是我目前的方法：

1. 我如何获取数据和时间

在HubSpot，我有一个数据库表。在该表中，我有一列类型为date and time. 作为参考，该字段中的值如下：

在此处输入图像描述

我已经运行 afor loop来获取它的date 和 time作为单独的变量（event_date是数据库表中的列名）：

{% for data in table_query %}
  {% set event_date    = data.event_date|datetimeformat('%B %e, %Y') %}
  {% set event_time    = data.event_date|datetimeformat('%H %M') %}
{% endfor %}

要查看datetimeformat我使用的参数 -请参阅此处的文档

打印{{ event_date }}：2020 年 9 月 7 日
打印{{ event_time }}：11 59

2. 现在我有了 vars 中的日期和时间，我是如何尝试找出差异的

在 hero.html 中：

{% for data in table_query %}
   {% set event_date    = data.event_date|datetimeformat('%B %e, %Y') %}
   {% set event_time    = data.event_date|datetimeformat('%H %M') %}
{% endfor %}


<script>

  var event_date = new Date('{{ event_date }}');
  var todays_date = new Date();


  function getDifferenceInDays(event_date, todays_date) {
    var diffInMs = Math.abs(todays_date - event_date);
    return diffInMs / (1000 * 60 * 60 * 24);
  }

  function getDifferenceInHours(event_date, todays_date) {
    var diffInMs = Math.abs(todays_date - event_date);
    return diffInMs / (1000 * 60 * 60);
  }

  function getDifferenceInMinutes(event_date, todays_date) {
    var diffInMs = Math.abs(todays_date - event_date);
    return diffInMs / (1000 * 60);
  }

  function getDifferenceInSeconds(event_date, todays_date) {
    var diffInMs = Math.abs(todays_date - event_date);
    return diffInMs / 1000;
  }

  console.log(getDifferenceInDays(event_date, todays_date));
</script>

我的问题：

有了以上内容，我得到console.log了NaN. 我试图在days, hours,中获得结果minutes，seconds因为我将它划分为事件计时器的倒计时。

我完全不知道如何能够检查事件时间 - 试图让倒数计时器尽可能准确，倒数到事件开始，但不确定我该如何做到这一点

注意：标记twig也是语法类似于HubL

4

2 回答 2

0

您的问题出在 event_data 中。你得到的可能是整数旁边的字符串。例如，如果您对新日期进行硬编码，您将得到控制台的答案。

var event_date = new Date(2020, 08, 03, 12, 15, 30);
  var todays_date = new Date();


  function getDifferenceInDays(event_date, todays_date) {
    var diffInMs = Math.abs(todays_date - event_date);
    return diffInMs / (1000 * 60 * 60 * 24);
  }

  function getDifferenceInHours(event_date, todays_date) {
    var diffInMs = Math.abs(todays_date - event_date);
    return diffInMs / (1000 * 60 * 60);
  }

  function getDifferenceInMinutes(event_date, todays_date) {
    var diffInMs = Math.abs(todays_date - event_date);
    return diffInMs / (1000 * 60);
  }

  function getDifferenceInSeconds(event_date, todays_date) {
    var diffInMs = Math.abs(todays_date - event_date);
    return diffInMs / 1000;
  }

  console.log(getDifferenceInDays(event_date, todays_date));

https://codepen.io/Elnatan/pen/jOqNPMm
（检查控制台）

于 2020-08-02T22:25:28.537 回答
0

您的 NaN 来自于为您的日期构造函数提供一个字符串，该字符串围绕您的模板呈现输出

var event_date = new Date('{{ event_date }}');
// should be
var event_date = new Date({{ event_date }});

我认为你真正需要的是使用 moment.js ( https://momentjs.com/ )

这是一个简单的天不同的例子。目前文档的持续时间相当广泛：https ://momentjs.com/docs/#/durations/

var now  = "04/09/2013 15:00:00";
var then = "02/09/2013 14:20:30";

var ms = moment(now,"DD/MM/YYYY HH:mm:ss").diff(moment(then,"DD/MM/YYYY HH:mm:ss"));
var d = moment.duration(ms).asDays();
于 2020-08-02T22:41:34.190 回答