zoukankan      html  css  js  c++  java
  • Javascript倒计时页面跳转

    在js中实现页面定时跳转我们要使用setInterval或setTimeOut函数,还可以使用页面的meta实现。
    例1:
    <script type="text/javascript" language="JavaScript">
        var startTime = new Date();
        var endTime=startTime.getTime()+10*60*1000;
        var g_blinkswitch = 0;
        var g_blinktitle = document.title;
        function getRemainTime(){
            var nowTime = new Date();
            var nMS =endTime - nowTime.getTime();
            var nM=Math.floor(nMS/(1000*60)) % 60;
            var nS=Math.floor(nMS/1000) % 60;
            if(nM==0&&nS==0&&nMS<1000) //当倒计时结束
            {
                window.focus();
                setInterval("blinkNewMsg()", 1000);
                window.location.reload();
            }
            if(nS < 10) nS = "0" + nS;
            if(nMS >= 0){
                document.getElementById("remainTime").innerHTML= nM + "分" + nS + "秒";
                setTimeout("getRemainTime()",1000);
            }       
        }   
        function blinkNewMsg()
        {
            document.title = g_blinkswitch % 2==0 ? "【   】 - " + g_blinktitle : "【新消息】 - " +
            g_blinktitle;
            g_blinkswitch++;
        }   
     window.onload=getRemainTime;
    </script>
    <strong id="remainTime">10分00秒</strong>
     
    例2
    倒计时跳转页面
    <title>JS倒计时网页自动跳转代码</title>  
    <script language="JavaScript" type="text/javascript">
     function delayURL(url) {
      var delay = document.getElementById("time").innerHTML;
      if(delay > 0) {
       delay--;
       document.getElementById("time").innerHTML = delay;
      } else {
       window.top.location.href = url;
      }
      setTimeout("delayURL('" + url + "')", 1000);
     }
    </script>
    <span id="time" style="background: #00BFFF">3</span>秒钟后自动跳转,如果不跳转,请点击下面的链接<a href="http://www.jbxue.com">脚本学堂</a>
    <script type="text/javascript">
    delayURL("http://www.jbxue.com");
    </script>
     
    例3 防刷新的倒计时代码
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
    <title> www.jbxue.com--倒计时页面</title> 
    </head> 
    <body> 
    <SCRIPT LANGUAGE="JavaScript"> 
    <!-- 
    var maxtime; 
    if(window.name==''){  
    maxtime = 1*60; 
    }else
    maxtime = window.name; 

    function CountDown(){ 
    if(maxtime>=0){ 
    minutes = Math.floor(maxtime/60); 
    seconds = Math.floor(maxtime%60); 
    msg = "距离考试结束还有"+minutes+"分"+seconds+"秒"; 
    document.all["timer"].innerHTML = msg; 
    if(maxtime == 5*60) alert('注意,还有5分钟!'); 
    --maxtime; 
    window.name = maxtime;  

    else
    clearInterval(timer); 
    alert("考试时间到,结束!"); 


    timer = setInterval("CountDown()",1000); 
    //-->
    </SCRIPT> 
    <div id="timer" style="color:red"></div>  
    </body> 
    </html>
  • 相关阅读:
    10. Regular Expression Matching
    Leetcode:9. Palindrome Number
    MySQL
    MyBatis Plus 自动类型转换之TypeHandler
    深拷贝和浅拷贝
    【强制】不要在程序中写死一年为 365 天,避免在公历闰年时出现日期转换错误或程序逻辑 错误。
    【强制】日期格式化时,传入 pattern 中表示年份统一使用小写的 y。
    【推荐】循环体内,字符串的连接方式,使用 StringBuilder 的 append 方法进行扩展。
    【强制】POJO如果继承了另一个 POJO 类,注意在前面加一下 super.toString。
    【强制】禁止使用构造方法 BigDecimal(double)的方式把 double 值转化为 BigDecimal 对象。
  • 原文地址:https://www.cnblogs.com/linuxnotes/p/3314745.html
Copyright © 2011-2022 走看看