gpt4 book ai didi

ajax - 如何在 django 中实现倒数计时器

转载 作者:行者123 更新时间:2023-12-04 00:09:15 26 4
gpt4 key购买 nike

我只需要一个大致的想法。我正在用 django 开发一个运动应用程序。此应用程序需要测量时间并将其显示给用户。在倒计时期间,我还需要执行一些可能发生的“ Action ”。这意味着根据一种操作类型调用另一个 View ,标记此操作并使用计时器重定向回原始 View ,用户现在可以在其中看到更改。我想我无法在服务器端(django)上实现倒计时。我必须使用 JavaScript 执行此操作,但是……每次用户执行操作时,倒计时都会停止。我必须为此使用 AJAX 吗?有没有更好的方法来实现这一点。谢谢

最佳答案

模型.py

class chek(models.Model):
date = models.DateTimeField(auto_now_add=False, blank=True, null=True)

views.py

def jaya(request):
ob=chek.objects.get(id=2)
return render(request,'jaya.html',{'ob':ob})

使用这样的脚本

<script>
function makeTimer() {
var endTime=new Date({{ ob.date|date:"U" }} * 1000);
endTime = (Date.parse(endTime) / 1000);

var now = new Date();
now = (Date.parse(now) / 1000);

var timeLeft = endTime - now;

var days = Math.floor(timeLeft / 86400);
var hours = Math.floor((timeLeft - (days * 86400)) / 3600);
var minutes = Math.floor((timeLeft - (days * 86400) - (hours * 3600 )) / 60);
var seconds = Math.floor((timeLeft - (days * 86400) - (hours * 3600) - (minutes * 60)));

if (hours < "10") { hours = "0" + hours; }
if (minutes < "10") { minutes = "0" + minutes; }
if (seconds < "10") { seconds = "0" + seconds; }

$("#days").html(days + "<span>Days</span>");
$("#hours").html(hours + "<span>Hours</span>");
$("#minutes").html(minutes + "<span>Minutes</span>");
$("#seconds").html(seconds + "<span>Seconds</span>");

}

setInterval(function() { makeTimer(); }, 1000);
</script>

html 正文

<body class="game_info" data-spy="scroll" data-target=".header">

<div class="col-md-6 col-sm-6 col-xs-12">
<div class="row">
<div class="full">
<div class="right-match-time">
<h2>Next Match</h2>
<ul id="countdown-1" class="countdown">
<li><span id="days"></span>Day </li>
<li><span id="hours"></span>Hours </li>
<li><span id="minutes"></span>Minutes </li>
<li><span id="seconds"></span>Seconds </li>
</ul>

</div>
</div>
</div>
</div>
</div>

关于ajax - 如何在 django 中实现倒数计时器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10603409/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com