在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>

Javascript倒计时页面跳转的更多相关文章

  1. JavaScript 之 页面跳转及Frame动态加载

    一.页面跳转 JS跳转大概有以下五种方式: 1.跳转到B页面 <script language="javascript" type="text/javascript ...

  2. javascript实现页面跳转

    这里指的页面跳转是将浏览器标签页转到新的网址. 只需要使用 window.location.href="url" 就行了 示例 <!DOCTYPE html> < ...

  3. Javascript实现页面跳转的几种方式

    概述 相信很多Web开发者都知道,在开发Web程序的时候,对于页面之间的跳转,有很多种,但是有效的跳转则事半功倍,下面就是我在平时的开发过程中所用到的一些JavaScript跳转方式,拿出和大家共享一 ...

  4. JavaScript 各种页面跳转方法

    第一种: window.location.href="login.jsp?backurl=\"+window.location.href; 第二种: alert("返回& ...

  5. js倒计时页面跳转

    HTML: <p><span id="timer">60</span>s 后跳转到百度首页</p> JS: //倒计时方法 func ...

  6. 《JavaScript》页面跳转

    window.location.href: <i onclick="window.location.href = '/Form/Form_Write/Index?viewname=Fo ...

  7. JS页面跳转的常用方法整理.

    <script type="text/javascript"> //js页面跳转 function showtabs() { window.location.href ...

  8. 通过javascript库JQuery实现页面跳转功能代码

    通过javascript库JQuery实现页面跳转功能代码的四段代码实例如下. 实例1: 1 2 3 4 $(function(){ var pn = $("#gotopagenum&quo ...

  9. javascript倒计时调转页面

    <html><head><meta http-equiv="Content-Type" content="text/html; charse ...

随机推荐

  1. 炼数成金hadoop视频干货01

    视频地址:http://pan.baidu.com/s/1dDEgKwD 最开始还是讲hadoop的起源,但是和其他垃圾视频不同,不是照本宣科,听了还是受益.作者给人一种感觉就是他是确实把他的经验和体 ...

  2. Java中jar命令详解

    做项目的时候我们肯定接触过很多jar包,那么jar包是什么呢?笔者了解到jar是java archive file 的简写.从名字就可以知道,它的应用与Java息息相关.下面就详细介绍如何自己生成ja ...

  3. jq选择器 第一部分

    没有什么新意,全是从网上摘抄的,如果哪天忘了,就来查查吧. 1. id选择器(指定id元素) 将id="one"的元素背景色设置为黑色.(id选择器返单个元素) $(documen ...

  4. ASP.NET MVC and jqGrid 学习笔记 2-如何从本地获得数据

    上回说到jqgrid的基本配置,同时演示了显示数据的一种方法——datatype: "local".这种方法是从本地获取的,确切地说是在前端页面的javascript里写的硬编码. ...

  5. iOS之与JS交互通信

    随着苹果SDK的不断升级,越来越多的新特性增加了进来,本文主要讲述从iOS6至今,Native与JavaScript的交互方法 一.UIWebview && iframe && ...

  6. truncate与delete 、drop的区别

    注意事项 1.在oracle中数据删除后还能回滚是因为它把原始数据放到了undo表空间. 2.DML语句使用undo表空间,DDL语句不使用undo,  而delete是DML语句,truncate是 ...

  7. [改善Java代码]提防包装类型的null值

    建议26: 提防包装类型的null值 我们知道Java引入包装类型(Wrapper Types)是为了解决基本类型的实例化问题,以便让一个基本类型也能参与到面向对象的编程世界中.而在Java 5中泛型 ...

  8. css3 盒模型记

    css3 盒模型 css假定每个元素都会生成一个或多个矩形框,这称为元素框.各元素框中心有一个内容区.这个内容区周围有可选的内边距,边框和外边距.这些项之所以被认为是可选的,原因是它们的宽度可以设置为 ...

  9. html5 之 canvas 相关知识(三)API-strokeStyle-shadow相关

    strokeStyle定义和用法 strokeStyle 属性设置或返回用于笔触的颜色.渐变或模式. context.strokeStyle=color|gradient|pattern;//指示绘图 ...

  10. 如何通过PhpMyAdmin批量删除MYSQL数据库数据表

    使用这个方法前,强烈建议先备份整个数据库.至于怎么备份?你不会么?在本文下方留言吧. 具体方法:复制下面的php执行语句,保存为sql.php文件(注意配置数据库名称.密码.数据表头),通过ftp上传 ...