<script type="text/javascript" language="javascript">
        var target=[]
        var time_id=[]
        /*
          原理:每次和当前时间比较,得到天、小时、分、秒
        */
        function show_date_time_0()
        {
            setTimeout("show_date_time_0()", 1000);
            for (var i=0,j=target.length;i<j;i++)
            {
                today=new Date();         
                //计算目标时间与当前时间间隔(毫秒数)
                var timeold=target[i]-today.getTime(); //getTime 方法返回一个整数值,这个整数代表了从 1970 年 1 月 1 日开始计算到 Date 对象中的时间之间的毫秒数。
               
                //计算目标时间与当前时间的秒数
                var sectimeold=timeold/1000;
               
                //计算目标时间与当前时间的秒数(整数)
                var secondsold=Math.floor(sectimeold);
               
                //计算一天的秒数
                var  msPerDay=24*60*60*1000;
              
                //得到剩余天数
                var e_daysold=timeold/msPerDay;
                 //得到剩余天数(整数)
                var daysold=Math.floor(e_daysold);
               
                //得到剩余天数以外的小时数
                var e_hrsold=(e_daysold-daysold)*24;
                 //得到剩余天数以外的小时数(整数)
                var hrsold=Math.floor(e_hrsold);
               
                //得到尾剩余分数
                var e_minsold=(e_hrsold-hrsold)*60;
                //得到尾剩余分数(整数)
                minsold=Math.floor((e_hrsold-hrsold)*60);
               
                //得到尾剩余秒数(整数)
                seconds=Math.floor((e_minsold-minsold)*60);
                if (daysold<0)
                {
                    document.getElementById(time_id[i]).innerHTML="逾期,倒计时已经失效";
                } 
                else
                {
                    //天数取三位,不足时前边补0
                    if (daysold<10) { daysold="0"+daysold }
                    //天数取三位,不足时前边补0
                    if (daysold<100) { daysold="0"+daysold }
                   
                    //小时取两位,不足补0
                    if (hrsold<10) { hrsold="0"+hrsold }
                    //分数取两位,不足补0
                    if (minsold<10) {minsold="0"+minsold}
                    //秒数取两位,不足补0
                    if (seconds<10) {seconds="0"+seconds}
                   
                    //小于三天时,字体为红色
                    if (daysold<3) {
                        document.getElementById(time_id[i]).innerHTML="<font color=red>"+daysold+"天"+hrsold+"小时"+minsold+"分"+seconds+"秒</font>";
                    } 
                    else
                    {
                        document.getElementById(time_id[i]).innerHTML=daysold+"天"+hrsold+"小时"+minsold+"分"+seconds+"秒";
                    }
                }
                
            }
        }
        setTimeout("show_date_time_0()", 100);
    </script>
时间1   2008-08-08 04:00:00:
    <div id="TimeCounter_0" style="border: 1px solid black; margin: 5px; padding: 2px;
        width: 300px">
    </div>
<script type="text/javascript">
        //设定目标时间(数组元素)
        //target[target.length]=new Date(年,月-1,日,时,分,秒).getTime()
        target[target.length]=new Date(2008,08-8,04,00,00,00).getTime();
       
        //设定倒计时显示地址(数组元素)
        time_id[time_id.length]="TimeCounter_0"
    </script>
时间2   2020-08-08 08:08:08:
    <div id="TimeCounter_1" style="border: 1px solid black; margin: 5px; padding: 2px;
        width: 300px">
    </div>
<script type="text/javascript">
        target[target.length]=new Date(2020,8,8,8,8,8).getTime()
        time_id[time_id.length]="TimeCounter_1"
    </script>
时间3   2099-08-08 08:08:08:
    <div id="TimeCounter_3" style="border: 1px solid black; margin: 5px; padding: 2px;
        width: 300px">
    </div>
<script type="text/javascript">
        target[target.length]=new Date(2099,8,8,8,8,0).getTime()
        time_id[time_id.length]="TimeCounter_3"
    </script>
<br><br><br><br>
<span id="mytime" style="color:#FF0000;">10000</span> 秒钟自动跳转到登陆页
<script>
function runtime()
{
 document.getElementById('mytime').innerHTML=document.getElementById('mytime').innerHTML-1;
 if(document.getElementById('mytime').innerHTML==0)
 {
  location.href='Login.aspx';
 }
 setTimeout("runtime()",1000);
}
runtime();
</script>
 

转载于:https://blog.51cto.com/smilecong/174509

js 实现“倒计时” 以及 N秒后跳转页面相关推荐

  1. JS实现倒计时三秒跳转后到新页面

    为了是网站的页面更友好,更加人性化,我们往往会在操作错误或是成功的时候进行提示然后跳转到相应的页面.同时为了使页面更加美化,我们往往会加上倒计时跳转功能,也就是使网页上的秒杀呈现倒数显示.下面就是具体 ...

  2. html怎么让js延迟3秒跳转,JS使用setInterval或setTimeout隔几秒后跳转页面

    跳转页面主要使用window的两个对象方法,setInterval()和setTimeout() setInterval(code,millisec) 定义和用法 setInterval() 方法可按 ...

  3. JavaScript实现3秒后跳转页面

    <!doctype html> <html lang="en"> <head><meta charset="UTF-8" ...

  4. 1秒后跳转页面(延时setTimeout)

    下面的代码将在1000毫秒后执行双引号中的函数,跳转页面. Code: <script language="javascript"> setTimeout(" ...

  5. js实现5秒后跳转页面

    提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 一.使用js代码实现延时跳转 二.使用步骤 1.定时器 setInterval 2.location跳转 3.整体实现 总结 ...

  6. html 跳转后关闭当前页面,js实现3秒后关闭当前页面

    1.js实现3秒后关闭当前页面 var time=3; function closeWindow(){ window.setTimeout('closeWindow()',1000); if(time ...

  7. vue跳转页面增加等待_vue实现几秒后跳转新页面代码

    我就废话不多说了,大家还是直接看代码吧~ 提交 export default { data(){ return { count:"",//倒计时 } } }, mounted(){ ...

  8. php多少秒后跳转_php等待几秒后跳转

    php等待几秒后跳转 一.PHP脚本控制跳转方式,通过改写HTTP头信息来进行跳转 a)header refresh方式:<?php header("refresh:5;url=htt ...

  9. JavaScript实现5秒后跳转界面

    打开代码,静待5秒后跳转新界面 代码如下: <!DOCTYPE html> <html lang="en"><head><meta cha ...

最新文章

  1. classloader resource
  2. NVMe SSD是什么?
  3. Taro+react开发(53) Taro提示操作
  4. 鸿蒙os硬件要求,华为公布鸿蒙OS 2.0硬件安装要求:只要128K内存就能跑
  5. spark数据本地性级别划分
  6. BaseRecyclerViewAdapterHelper: 灵活强大的循环适配器
  7. c:\program files\microsoft visual studio\vc98\mfc\include\afxv_w32.h(14) : fatal error C1189:
  8. oracle序列不连续,Oracle不连续的值,如何实现查找上一条、下一条
  9. 微信小程序开发工具基本介绍入门级(备忘)
  10. cdr多页面排版_CDR排版须掌握三大功能 值得收藏
  11. c#设置导出Excel的列宽
  12. 解决vscode没有文件图标(亲测有效)
  13. MOS管当开关控制时,一般用PMOS做上管NMOS做下管的原因
  14. Adobe AE CC切换语言 中英文切换
  15. 08.vue.js实战笔记(计算属性、v-bind及class和style的绑定、内置指令、方法与事件)
  16. Ubuntu系统安装webrtc
  17. 软件需求与分析需要掌握的内容
  18. 个税报税服务器证书不合法,【问答】本月个税申报,这4个问题一定要搞清楚!...
  19. python检索用人名查电话_创建一个将人名用作键的字典后,输入姓名查找值,返回错误...
  20. Win10桌面隐藏显示版本号

热门文章

  1. 在PHPStorm中支持ThinkPHP代码提示
  2. Kafka Architecture
  3. Step1帐户登录系统(6.使用OpenID登录网站)
  4. 事务管理最佳实践全面解析
  5. Linux 虚拟化网络技术 — 虚拟二层网卡(Tap)与虚拟三层隧道网卡(Tun)
  6. 5G NR — Massive MIMO 与波束赋形
  7. Redis 的持久化方案
  8. 互联网协议 — QUIC 快速 UDP 互联网连接
  9. Jmeter 多台机器产生负载及问题解决方法
  10. ant design pro (十六)advanced 权限管理