Django python + javascript 倒计时 – Python 和 Javascript 的不同时间?
Django python + javascript countdown – different times in Python and Javascript?
编辑 #2
同样,我花了一些时间编写代码并进行了更多研究:
在我的 views.py 中,我执行以下操作
timestamp = datetime.combine(inst.date, inst.time).strftime('%s')
timestamp
通过模板传递给 javascript。
但是无法解释的(对我来说)发生在 views.py
输出views.py
Timestamp: 2022-02-03 20:10:00
Timestamp.strftime('%s'): 1643919000
输出javscript
Date Thu Feb 03 2022 21:10:00 GMT+0100 (Central European Standard Time)
1643919000000
(毫秒)秒输出基本相同,但 Python 中的 datetime.datetime object
和 Javascript 中的 Date
对象不同。
这里有什么魔力?
编辑
经过一些重新调整(感谢评论中的 Kyvex),我将差距缩短到一小时。现在可以用某种方式解释了:
现在是 .js 代码:
var countDownDate = JSON.parse(document.getElementById('timestamp').textContent); //new Date("Feb 2, 2022 22:59:00 GMT+0000").getTime();
var x = setInterval(function () {
var now = new Date().getTime();
console.log(countDownDate);
const GMT = 3600000;
console.log(now);
var difference = countDownDate * 1000 - now - GMT;
var days = Math.floor(difference / (1000 * 60 * 60 * 24));
var hours = Math.floor((difference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((difference % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((difference % (1000 * 60)) / 1000);
document.getElementById("clock").innerHTML = days + "d " + hours + "h "
+ minutes + "m " + seconds + "s ";
if (difference < 0) {
clearInterval(x);
document.getElementById("clock").innerHTML = "<h1>EXPIRED!</h1>";
}
}, 1000);
我同时记录了 countDownDate
和 now
。看起来他们使用不同的偏移量。 countDownDate
,来自 python,似乎有 GMT+0000 的偏移量,而 now
returns GMT+0100。我现在通过减去 const GMT = 3600000
来硬编码这个差异。但这并不能解决问题。
如何让它们同步?
我比较新,只是一个业余程序员。目前,我尝试在一个小型 Django 项目上工作,我想通过表单设置未来的日期和时间,在用户单击“提交”后,页面显示从现在到设置的日期和时间的倒计时。
在对 datetime 模块进行了一些试验后,我发现自己遇到了一个棘手的问题。我在表格中有两个字段:1. 日期和 2. 时间
使用 timestamp = datetime.datetime.combine(date, time).strftime('%s')
我将这两个信息结合起来并获得秒输出。然后,我使用 {{ timestamp|json_script:'timestamp'}}
.
将 timestamp
传递到我的 .js 文件
这是我的 .HTML 代码:
<body>
{% load static %}
<html>
<form method="post" enctype="multipart/form-data">
{% csrf_token %} {{ form.as_p }}
<button type="submit">Submit</button>
</form>
{% if inst %}
<center><h3>Success</h3>
<div id="clock"></div></center>
{{ timestamp | json_script:'timestamp'}}
<script src="{% static 'js/timer.js' %}"></script>
{% endif %}
</html>
</body>
如果我现在设置setTime
未来只有2分钟,我的倒计时显示4小时,而difference
是3小时。
我知道时区和 DST 差异在起作用,但从我所在的地方算起,加起来最多 3 或 4 个小时。
如果这太不专业而且只是对我的问题的粗略描述,请原谅。我将感谢社区的帮助,因为我正在努力变得更好并理解这里的所有这些基础流程。
非常感谢!
我刚刚解决了!!
这是我的 .js 代码
var countDownDate = JSON.parse(document.getElementById('timestamp').textContent);
var newDate = new Date(countDownDate * 1000);
// Get NOW
var now = new Date();
// Get Timezone offset from imported date
var tzDifference = newDate.getTimezoneOffset();
// calculate the new offset time
var offsetNewTime = new Date(newDate.getTime() + tzDifference * 60 * 1000)
var x = setInterval(function () {
var now = new Date();
// console.log(now.getTime());
var difference = offsetNewTime - now;
var days = Math.floor(difference / (1000 * 60 * 60 * 24));
var hours = Math.floor((difference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((difference % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((difference % (1000 * 60)) / 1000);
document.getElementById("clock").innerHTML = days + "d " + hours + "h "
+ minutes + "m " + seconds + "s ";
if (difference < 0) {
clearInterval(x);
document.getElementById("clock").innerHTML = "<h1>EXPIRED!</h1>";
}
}, 1000);
在此post的帮助下:add or subtract timezone difference to javascript Date
不知何故,我从 python 和 javascript 得到了两个不同的时间偏移。所以我用 getTimezoneOffset();
来解释这个并将这个偏移量添加到导入的日期时间。
这现在可以正常工作了,我希望它独立于人们发现自己所在的时区。
当然,如果您对此有任何意见,请随时添加。
编辑 #2
同样,我花了一些时间编写代码并进行了更多研究:
在我的 views.py 中,我执行以下操作
timestamp = datetime.combine(inst.date, inst.time).strftime('%s')
timestamp
通过模板传递给 javascript。
但是无法解释的(对我来说)发生在 views.py
输出views.py
Timestamp: 2022-02-03 20:10:00
Timestamp.strftime('%s'): 1643919000
输出javscript
Date Thu Feb 03 2022 21:10:00 GMT+0100 (Central European Standard Time) 1643919000000
(毫秒)秒输出基本相同,但 Python 中的 datetime.datetime object
和 Javascript 中的 Date
对象不同。
这里有什么魔力?
编辑
经过一些重新调整(感谢评论中的 Kyvex),我将差距缩短到一小时。现在可以用某种方式解释了:
现在是 .js 代码:
var countDownDate = JSON.parse(document.getElementById('timestamp').textContent); //new Date("Feb 2, 2022 22:59:00 GMT+0000").getTime();
var x = setInterval(function () {
var now = new Date().getTime();
console.log(countDownDate);
const GMT = 3600000;
console.log(now);
var difference = countDownDate * 1000 - now - GMT;
var days = Math.floor(difference / (1000 * 60 * 60 * 24));
var hours = Math.floor((difference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((difference % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((difference % (1000 * 60)) / 1000);
document.getElementById("clock").innerHTML = days + "d " + hours + "h "
+ minutes + "m " + seconds + "s ";
if (difference < 0) {
clearInterval(x);
document.getElementById("clock").innerHTML = "<h1>EXPIRED!</h1>";
}
}, 1000);
我同时记录了 countDownDate
和 now
。看起来他们使用不同的偏移量。 countDownDate
,来自 python,似乎有 GMT+0000 的偏移量,而 now
returns GMT+0100。我现在通过减去 const GMT = 3600000
来硬编码这个差异。但这并不能解决问题。
如何让它们同步?
我比较新,只是一个业余程序员。目前,我尝试在一个小型 Django 项目上工作,我想通过表单设置未来的日期和时间,在用户单击“提交”后,页面显示从现在到设置的日期和时间的倒计时。
在对 datetime 模块进行了一些试验后,我发现自己遇到了一个棘手的问题。我在表格中有两个字段:1. 日期和 2. 时间
使用 timestamp = datetime.datetime.combine(date, time).strftime('%s')
我将这两个信息结合起来并获得秒输出。然后,我使用 {{ timestamp|json_script:'timestamp'}}
.
timestamp
传递到我的 .js 文件
这是我的 .HTML 代码:
<body>
{% load static %}
<html>
<form method="post" enctype="multipart/form-data">
{% csrf_token %} {{ form.as_p }}
<button type="submit">Submit</button>
</form>
{% if inst %}
<center><h3>Success</h3>
<div id="clock"></div></center>
{{ timestamp | json_script:'timestamp'}}
<script src="{% static 'js/timer.js' %}"></script>
{% endif %}
</html>
</body>
如果我现在设置setTime
未来只有2分钟,我的倒计时显示4小时,而difference
是3小时。
我知道时区和 DST 差异在起作用,但从我所在的地方算起,加起来最多 3 或 4 个小时。
如果这太不专业而且只是对我的问题的粗略描述,请原谅。我将感谢社区的帮助,因为我正在努力变得更好并理解这里的所有这些基础流程。
非常感谢!
我刚刚解决了!!
这是我的 .js 代码
var countDownDate = JSON.parse(document.getElementById('timestamp').textContent);
var newDate = new Date(countDownDate * 1000);
// Get NOW
var now = new Date();
// Get Timezone offset from imported date
var tzDifference = newDate.getTimezoneOffset();
// calculate the new offset time
var offsetNewTime = new Date(newDate.getTime() + tzDifference * 60 * 1000)
var x = setInterval(function () {
var now = new Date();
// console.log(now.getTime());
var difference = offsetNewTime - now;
var days = Math.floor(difference / (1000 * 60 * 60 * 24));
var hours = Math.floor((difference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((difference % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((difference % (1000 * 60)) / 1000);
document.getElementById("clock").innerHTML = days + "d " + hours + "h "
+ minutes + "m " + seconds + "s ";
if (difference < 0) {
clearInterval(x);
document.getElementById("clock").innerHTML = "<h1>EXPIRED!</h1>";
}
}, 1000);
在此post的帮助下:add or subtract timezone difference to javascript Date
不知何故,我从 python 和 javascript 得到了两个不同的时间偏移。所以我用 getTimezoneOffset();
来解释这个并将这个偏移量添加到导入的日期时间。
这现在可以正常工作了,我希望它独立于人们发现自己所在的时区。
当然,如果您对此有任何意见,请随时添加。