前端js倒计时(精确到毫秒)

话不多说,直接上代码:

  有需要直接拿走,

复制代码
<html>

<head>
    <style>
        div{
            width:100%;
             text-align:center;
            font-size: 14px;
        }
    </style>
</head>
        <div id="go">
        </div>
<body>
    <script>
        function countTime(time,id) {
                var date = new Date();
                var now = date.getTime();               
                var endDate = new Date(time);//设置截止时间
                var end = endDate.getTime();
                var leftTime = end - now; //时间差                              
                var d, h, m, s, ms;
                if(leftTime >= 0) {
                    d = Math.floor(leftTime / 1000 / 60 / 60 / 24);
                    h = Math.floor(leftTime / 1000 / 60 / 60 % 24);
                    m = Math.floor(leftTime / 1000 / 60 % 60);
                    s = Math.floor(leftTime / 1000 % 60);
                    ms = Math.floor(leftTime % 1000);
                    if(ms < 100) {
                        ms = "0" + ms;
                    }
                    if(s < 10) {
                        s = "0" + s;
                    }
                    if(m < 10) {
                        m = "0" + m;
                    }
                    if(h < 10) {
                        h = "0" + h;
                    }
                    //将倒计时赋值到div中
                document.getElementById(id).innerHTML = d + "" + h + "" + m + "" + s + ""+  ms + "毫秒";
                } else {
                    console.log('已截止')
                    //将倒计时赋值到div中
                    document.getElementById(id).innerHTML = "已开抢"
                }
                //递归每秒调用countTime方法,显示动态时间效果
               return leftTime
            }
            //调用方式  需要传入  结束时间   和 倒计时内容所在的id名称
            var s = setInterval(function (){
                   var dates =  countTime("2019-7-2 10:32:00", "go");
                    if(dates<=0) {
                        clearInterval(s)
                    }
            },50)
    </script>
</body>

</html>
        
复制代码

 

posted @   帅blog  阅读(8601)  评论(1编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列:基于图像分类模型对图像进行分类
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
阅读排行:
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 25岁的心里话
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· 闲置电脑爆改个人服务器(超详细) #公网映射 #Vmware虚拟网络编辑器
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
/* 鼠标点击求赞文字特效 */
点击右上角即可分享
微信分享提示