jQuery倒计时与片刻Js无法正常工作

时间:2017-07-10 20:31:13

标签: javascript jquery

所以我正在考虑使用这个jquery倒计时插件和时刻js的组合,如documentation所示。

但是,要么我没有使用正确的版本,要么其他内容被破坏。有任何想法吗?这是JSFiddle

var nextYear = moment.tz("2019-01-01 00:00", "America/Sao_Paulo");

$('#clock').countdown(nextYear.toDate(), function(event) {
  $(this).html(event.strftime('%D days %H:%M:%S'));
});

2 个答案:

答案 0 :(得分:2)

您没有为 jQuery 库和倒计时插件本身添加外部资源。

<强>更新

所以最终的例子就像下一个:

<div id="clock"></div>

<script src="https://momentjs.com/downloads/moment.min.js" type="text/javascript"></script>
<script src="https://momentjs.com/downloads/moment-timezone-with-data.min.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.countdown/2.2.0/jquery.countdown.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function() {
        var nextYear = moment.tz("2019-01-01 00:00", "America/Sao_Paulo");

        $('#clock').countdown(nextYear.toDate(), function(event) {
            $(this).html(event.strftime('%D days %H:%M:%S'));
        });
    });
</script>

答案 1 :(得分:0)

使用此代码:

    <div class="timer" id="countdown"></div>

    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery.countdown/2.2.0/jquery.countdown.js"></script>
    <script type="text/javascript">
    var myDate = new Date();

myDate.setDate(myDate.getDate() + 2);

$("#countdown").countdown(myDate, function(event) {
  $(this).html(
    event.strftime('<div  ><div  >%D</div><span  >days</span></div><div  ><div  >%H</div><span  >hrs</span></div><div  ><div  >%M</div><span  >mins</span></div><div  ><div  >%S</div><span  >sec</span></div>')
  );
});
    </script>