管理资源吧首页>>>教程>>>编程>>>JavaScript教程>>>

Javascript倒计时页面跳转实例小结

　　例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.glzy8.com">我的百度</a>

　　<script type="text/javascript">

　　delayURL("http://www.glzy8.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.glzy8.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>

　　例4：结合图片数字的现实更漂亮

　　代码中有图片，直接提供一个演示地址，注意里面的图片地址

　　http://demo.glzy8.com/js/2013/daojishi/index.htm

教程首页 更多教程