zoukankan      html  css  js  c++  java
  • 倒计时

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
        </head>
        <body>
         <h1 id="h">距离倒计时结束还有xx小时xx分钟xx秒</h1>
        </body>
    </html>
    <script>
        var h1 = document.getElementById("h");
        //获取现在的时间
        var now = new Date();
        //获取结束的时间
        var end = new Date( "2018-08-09 09:34:00" );
        //获取时间差(结束时间-开始时间)/1000
        var t = ( end.getTime()-now.getTime() )/1000;
        //假设值为true时,启动计时器
        var flag = true;
        function djs(){
            if( t < 0 ){
                h1.innerHTML = "倒计时结束";
                flag = false;
                return;
            }
            //剩余的小时
            var h = parseInt( t/3600 );
            //剩余的分钟
            var m = parseInt( ( t-h*3600 )/60 );
            //剩余的秒数
            var s = parseInt( t-h*3600-m*60 );
            //输出倒计时时间
            h1.innerHTML = "距离倒计时结束还有"+h+"小时"+m+"分钟"+s+"秒"
            
        }
        djs();
        //设置自动倒计时
        var time = setInterval( function(){
            if( flag ){
                t--;
                if( t<0 ){
                    h1.innerHTML = "倒计时结束";
                    //关闭倒计时
                    clearInterval( time );
                }else{
                    djs();
                }   
            }
        },1000 )
    </script>
  • 相关阅读:
    关于http与https之间的区别
    成功解决react+webpack打包文件过大的问题(时间已久,不建议继续阅读)
    使用angularjs实现注册表单
    在jQuery中使用canvas时遇到的问题
    使用canvas实现绚丽的时钟特效
    HTML5中的DOM新特性
    JavaScript中DOM节点层次Text类型
    wx小程序 createRewardedVideoAd
    移动端项目构建 [笔记]
    wx 小程序 | textarea +
  • 原文地址:https://www.cnblogs.com/tis100204/p/10328811.html
Copyright © 2011-2022 走看看