Question

我有一个初始计时器值。我怎样才能让它开始倒数到0？

我希望输出显示在另一个元素

中

<span id="time">03:30:00</span>
<span id="output"></span>

<script type="text/javascript">
    jQuery(function($){
        var val = $("#time").html();
        var output = "";

        // count down

        $("#output").html(output)
    });
</script>

Answer 1

<script type="text/javascript">
    $(function(){
        var val = $("#time").html().trim();
        console.log(val);
        val = val.split(":");
        var hr = parseInt(val[0].trim());
        var mn = parseInt(val[1].trim());
        var sc = parseInt(val[2].trim());
        console.log(val);
        var timer = setInterval(function(){                 
            if(hr==0 && mn==0 && sc==0){
            clearInterval(timer);
            return;
            }
            if(sc==0){
                sc=60;
                mn--;
            }
            if(mn==0 && sc==0){
                mn=60;  
                hr--;
            }

            sc--;
            $("#output").html(hr+":"+mn+":"+sc);
        },10);

    });

</script>

Answer 2

这不是正确答案，而是最佳实践

您应该使用新的时间元素

<time datetime="2014-08-29T20:00:00.000Z">3 minutes left</time>

其中datetime是ISO日期格式，用于表示将来发生的正确时刻然后在元素内部，您将呈现文本如何显示它

通过这样做，您可以消除慢速带宽/ DOM解析＆amp; javascript汇编到它开始倒计时的时候。

当它开始时，你应该计算每个摘要中每个小时/分钟/秒的时间。那么你就可以避免不正确的setTimeout / setInterval，它不会总是等待完全相同的时间，特别是当选项卡处于空闲状态时（在后台）如果setTimeout(fn, 1000)在背景中的位置，那么var finishDate = new Date(Date.now()+10000); // get point in future somehow var tick = function() { var now = new Date() var difference = finishDate - now; var hours = Math.floor(difference / 36e5), minutes = Math.floor(difference % 36e5 / 60000), seconds = Math.floor(difference % 60000 / 1000); console.log(hours, minutes, seconds); setTimeout(tick, now.getUTCMilliseconds()) } tick() // Start the digest可能需要4秒。

这是一个例子。

如何获取日期并在DOM中显示它取决于您

＆＃13;

{{1}}

＆＃13;

jQuery backword从初始HTML值倒计时

2 个答案: