JavaScript 倒计时到小时

标签 javascript jquery

我目前正在使用 Keith Wood 创建的 jQuery 倒计时插件,但我无法让它工作,我需要显示距离一天中的某个时间还剩多少小时、分钟和秒(例如: 18:00:00)。

body标签内的代码:

<?php
$begintijd = $display['start'].":00:00";
?>
<script>
var begintijd = "<?php echo $begintijd ?>";
$(function () {
    var vandaag = new Date();
    werktijd = new Date(vandaag.getDay() begintijd);
    $('#defaultCountdown').countdown({until: werktijd, format: 'HMS'});
});
</script>

$display['start'] 在这种情况下返回 18(并且该值是正确的)。

head标签内的代码:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="assets/plugin/js/jquery.plugin.js"></script>
<script src="assets/plugin/js/jquery.countdown.js"></script>

jQuery 插件文件:http://keith-wood.name/js/jquery.plugin.js

jQuery 倒计时文件:http://keith-wood.name/js/jquery.countdown.js

Chrome 在线显示“未捕获的语法错误:参数列表后缺少 )”:

werktijd = new Date(vandaag.getDay() 18:00:00);

我是 Javascript 新手,如有任何帮助,我们将不胜感激,提前致谢。

最佳答案

我有一个无需任何插件即可运行的脚本,可能正在使用中

HTML

<div id="days"></div>
<div id="hours"></div>
<div id="minutes"></div>
<div id="seconds"></div>

Javascript 和 PHP

<%php $begintijd = $display['start']; %>

$(document).ready(function(){  
    var timer = null,
        begintijd = "<%php echo $begintijd %>",
        endTime = new Date(); //time you want to end

   endTime.setHours(begintijd);
   endTime.setMinutes(0);
   endTime.setSeconds(0);
   endTime = (Date.parse(endTime)) / 1000;

    function makeTimer() {
        var now = new Date(),
            now = (Date.parse(now) / 1000),
            timeLeft = endTime - now;
       if(timeLeft > 0){
            var days = Math.floor(timeLeft / 86400),
                hours = Math.floor((timeLeft - (days * 86400)) / 3600),
                minutes = Math.floor((timeLeft - (days * 86400) - (hours * 3600 )) / 60),
                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>");

      }else{
       clearInterval(timer);
       $("#seconds").html("<span>00Seconds</span>");
      }  
   }
timer = setInterval(function() { makeTimer(); }, 1000);
})

JS fiddle https://jsfiddle.net/69ax5j4L/

关于JavaScript 倒计时到小时,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39406551/

相关文章:

javascript - $(document).ready 等效于异步加载的内容

javascript - 在新选项卡中打开链接时,使用 page.js 的 Polymer Routing 不会将 hashbang 添加到 URL

javascript - super 菜单 - 无法在悬停时选择子元素

javascript - 需要一个正则表达式来拆分 javascript 中的字符串

javascript - HTML5 Canvas 图像使用按钮从左到右向上移动

javascript - 如何在 React-Native 中创建字典应用程序?

javascript - Youtube iframe API : OnReady not firing for Chrome extension

javascript - 单击导航栏元素时显示隐藏的 div 元素

javascript - 将数据发布到 JsonP

javascript - 基于 javascript 函数隐藏/显示 Accordion