JS实现倒计时

最新推荐文章于 2023-01-04 09:00:57 发布

二萌偏

最新推荐文章于 2023-01-04 09:00:57 发布

阅读量430

点赞数 1

分类专栏：前端 JavaScript 文章标签： JS

本文链接：https://blog.csdn.net/weixin_39735923/article/details/84031127

版权

前端同时被 2 个专栏收录

8 篇文章 0 订阅

订阅专栏

JavaScript

8 篇文章 2 订阅

订阅专栏

demo代码：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>时间倒计时</title>
</head>
<body>
<form id="form1" runat="server">
    <div id="show">
    </div>
</form>
<script src="../../../libs/jQuery/jquery-3.2.1.js"></script>
<script>
    $(function () {
        TimeDown("show", 3600000)
    });
    /*
     时间倒计时
     TimeDown.js
     */
    function TimeDown(id, value) {

        //倒计时的总秒数
        var totalSeconds = parseInt(value / 1000);

        //取模（余数）
        var modulo = totalSeconds % (60 * 60 * 24);
        //小时数
        var hours = Math.floor(modulo / (60 * 60));
        modulo = modulo % (60 * 60);
        //分钟
        var minutes = Math.floor(modulo / 60);
        //秒
        var seconds = modulo % 60;

        hours = hours.toString().length == 1 ? '0' + hours : hours;
        minutes = minutes.toString().length == 1 ? '0' + minutes : minutes;
        seconds = seconds.toString().length == 1 ? '0' + seconds : seconds;

        //输出到页面
        document.getElementById(id).innerHTML =  hours + ":" + minutes + ":" + seconds;
        //延迟一秒执行自己
        if(hours == "00" && minutes == "00" && parseInt(seconds)-1<0){

        }else{
            setTimeout(function () {
                TimeDown(id, value-1000);
            }, 1000)
        }

    }
</script>
</body>
</html>