在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. C++_归并排序

    //合并有序数组 //合并例子 void MemeryArray(int a[], int n, int b[],int m, int c[]) { int i,j,k; i=j=k=0; while ...

  2. 替换运算符 shell

        ${变量:-word}如果变量存在且非空,则返回其值:否则返回word                  用于:如果变量未定义,则返回默认值即word      ${变量:+word}如果变量 ...

  3. myeclipse2014 安装maven3.3.9和mave配置本地仓库

    昨天晚上发现eclipse下一个aptana JS的编辑插件,就想装到myeclipse下,结果悲剧了,myeclipse每次启动都闪退,虽然最后解决了,但是myeclipse里面的自带插件不知少了好 ...

  4. reset.css(详细说明)

    @charset "utf-8";/************************************************************************ ...

  5. iOS 数据类型

    标签: 数据类型 1.Objective-C数据类型可以分为:基本数据类型.对象数据类型和id类型. 2.基本数据类型有:int.float.double和char类型. 3.对象类型就是类或协议所声 ...

  6. KindEditor编辑器, 利用ajax动态切换编辑器内容

    // 后台成功返回数据后的js处理 KindEditor.remove('#content_id'); // 先移除之前创建的编辑器 var editor = KindEditor.create('# ...

  7. poj 3155 最大密度子图

    思路: 这个还是看的胡伯涛的论文<最小割在信息学竞赛中的应用>.是将最大密度子图问题转化为了01分数规划和最小割问题. 直接上代码: #include <iostream> # ...

  8. 通过使用精简客户端,且不需要安装的客户端,配合PLSQL连接oracle数据库

    通过使用精简客户端,且不需要安装的客户端,配合PLSQL连接oracle数据库. 首先下载安装包在Oralce官方网站上下载Oracle Instantclient Basic package.地址如 ...

  9. HttpClient(4.3.5) - HTTP Execution Context

    Originally HTTP has been designed as a stateless, response-request oriented protocol. However, real ...

  10. setTimeout用法

    function faceSave() {                                    if(confirm("确定保存?"))              ...