zoukankan      html  css  js  c++  java
  • JavaScript实现页面显示倒计时功能

    下面是用JS中的日期函数和定时器完成的一个倒计时的例子,效果如图:

    代码如下:

    <!DOCTYPE html>
    <html>
        <head>
            <title>倒计时</title>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        </head>
        <body>
            <input type="button" onclick="daojishi();" value="开始倒计时"/>
            <div id="daojishi"></div>
        </body>
        <script type="text/JavaScript">
    
            function daojishi(){
                //获取当前时间
                var nowTime = new Date();
                //获取活动结束时间,这里注意,月份是0-11
                var EndTime = new Date(2018,05,11,15,24,0);
                //比较活动结束日期和当前时间
                var chaTime = EndTime.getTime() - nowTime.getTime();
    
                var nMS = 0;
                if (chaTime > 0){
                    nMS = chaTime;
                }if (chaTime == 0){
                    alert("活动时间到");
                    return;
                }else if(chaTime < 0){
                    alert("活动已过期");
                    return;
                }
    
                //floor() 方法执行的是向下取整计算,它返回的是小于或等于函数参数,并且与之最接近的整数。
                var nD = Math.floor(nMS / (1000 * 60 * 60) / 24);//
                var nH = Math.floor(nMS / (1000 * 60 * 60)) % 24;//
                var nM = Math.floor(nMS / (1000 * 60)) % 60;//
                var nS = Math.floor(nMS / 1000) % 60;//
    
                if (nH < 10) {
                    nH = '0' + nH;
                }
                if (nM < 10) {
                    nM = '0' + nM;
                }
                if (nS < 10) {
                    nS = '0' + nS;
                }
    
                document.getElementById("daojishi").innerHTML = "<span>"+nD+"</span>天<span>"+nH+"</span>时<span>"+nM+"</span>分<span>"+nS+"</span>秒";
                
                //定时器
                setTimeout(function() {
                    daojishi();
                }, 1000);
            }
        </script>
    </html>
  • 相关阅读:
    Redis源代码分析(十三)--- redis-benchmark性能測试
    kvm中运行kvm
    umount.nfs device busy day virsh extend diskSpace, attachDisk
    ultravnc
    openNebula dubug
    maintenance ShellScripts
    virsh VMI deploy data serial xml
    cloud computing platform,virtual authentication encryption
    基于C 的libvirt 接口调用
    storage theory
  • 原文地址:https://www.cnblogs.com/wbxk/p/6806695.html
Copyright © 2011-2022 走看看