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>
  • 相关阅读:
    纯前端导出Excel表格
    vue 组件按需引用,vue-router懒加载,vue打包优化,加载动画
    解决图片循环展示间距
    微信小程序aes前后端加密解密交互
    判断字符串中是否包含表情
    银行卡号Luhn校验算法
    身份证校验(支持15位和18位身份证号)、邮箱校验正则
    数组去重
    bootstrap 中 css 与 javascript 的使用
    js 分页
  • 原文地址:https://www.cnblogs.com/tis100204/p/10328811.html
Copyright © 2011-2022 走看看