首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何用jQuery插件制作一个小时倒计时器

如何用jQuery插件制作一个小时倒计时器
EN

Stack Overflow用户
提问于 2017-09-27 22:49:22
回答 1查看 1.7K关注 0票数 0

我想知道如何从这里用jQuery插件制作倒计时器,http://hilios.github.io/jQuery.countdown/

我需要一个2小时的倒计时器。这是我目前的代码:

代码语言:javascript
复制
<!DOCTYPE html>
<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript" src="https://cdn.rawgit.com/hilios/jQuery.countdown/2.2.0/dist/jquery.countdown.min.js"></script>
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-countdown/2.0.2/jquery.countdown.css">
</head>

<body>
    <p>hi</p>
    <div id="getting-started"></div>

    <script type="text/javascript">
    $('#getting-started').countdown('2020/10/10', function(event) {
        $(this).html(event.strftime('%D days %H:%M:%S'));
    });
    </script>
</body>
</html>
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2017-09-28 17:23:32

如果你只想显示一个2小时的倒计时,那么你必须得到当前的日期时间,并在2小时内将它加起来,然后设置倒计时。

使用这一行,您可以获得客户端的当前日期:var today = new Date();

然后,使用这一行,您可以创建一个新变量,其中包含所需的新日期(至于接下来的2个小时):

var newDate = today.setHours(today.getHours() + 2)

最后,您可以在代码中使用新创建的日期变量'2020/10/10'替换newDate

您的代码只要稍加修改,如下所示:

代码语言:javascript
复制
var param = 2; // Change this if you want more or les than 2 hours

var today = new Date();
var newDate = today.setHours(today.getHours() + param);

$('#getting-started').countdown(newDate, function(event) {
  $(this).html(event.strftime('%H:%M:%S'));
});
代码语言:javascript
复制
<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery-countdown/2.0.2/jquery.countdown.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://cdn.rawgit.com/hilios/jQuery.countdown/2.2.0/dist/jquery.countdown.min.js"></script>

<p>hi</p>
<div id="getting-started"></div>

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/46458370

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档