javascript/倒计时计时器

javascript/countdown timer

本文关键字:计时器 倒计时 javascript      更新时间:2023-09-26

我的倒计时计时器需要帮助。我有一个unix时间戳,我想在几分钟内从中倒计时。它应该只在我的跨度中打印出"还剩X分钟"。我不知道为什么它不起作用。我把jquery放在上面,所以jquery正在使用中。

HTML:

<span id="time-left">x</span>

JS:

<script type="text/javascript">
$(document).ready(function() {
    setTimeout(function(){
        var endTime = 1450992799399;
        var curTime = Math.floor((new Date()).getTime() / 1000);
        var seconds = endTime - curTime;
        var minutes = Math.floor(seconds / 60);
        seconds %= 60;
        $('#time-left').html() = minutes + " minutes left.";
    }, 1000);
});

我希望它每秒钟都能更新。但现在它什么都没做。在我的跨度中,文本保持为"x"。

jQuery使用的是方法,而不是属性,所以它是
$(element).html('HTML to set');

不是

$(element).html() = 'HTML to set'; 

给你

$(document).ready(function() {
    setTimeout(function(){
        var endTime = 1450992799399;
        var curTime = Date.now();
        var seconds = curTime - endTime;
        var minutes = Math.floor((seconds / 60) / 1000);
        $('#time-left').html( minutes + " minutes left.");
    }, 1000);
});
<script>
    var countdown = new Date("May 28, 2018 12:00:00").getTime();
    var x = setInterval(function(){
        var now = new Date().getTime();
        var distance = countdown - now;
        var days = Math.floor(distance / (1000 * 60 * 60 * 24));
        var hours = Math.floor(distance % (1000 * 60 * 60 * 24) / (1000 * 60 * 60));
        var minutes = Math.floor(distance % (1000 * 60 * 60) / (1000 * 60));
        var seconds = Math.floor(distance % (1000 *60) / 1000);
        document.getElementById("timer").innerHTML = "D " + days + " H " +  hours + " M " + minutes + " S " + seconds;
    },1000)
    if(distance < 0){
        clearInterval(x);
        document.getElementById("timer").innerHTML = "EXPIRED";
    }
</script>
<div id="timer" class="timer"></div>