Javascript倒计时页面跳转实例小结_Javascript教程-查字典教程网
Javascript倒计时页面跳转实例小结
Javascript倒计时页面跳转实例小结
发布时间:2016-12-30 来源:查字典编辑
摘要:例1:复制代码代码如下:varstartTime=newDate();varendTime=startTime.getTime()+10*6...

例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">3</span>秒钟后自动跳转,如果不跳转,请点击下面的链接<a href="http://www.jb51.net">我的百度</a>

<script type="text/javascript">

delayURL("http://www.jb51.net");

</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.jb51.net</title>

</head>

<body>

<SCRIPT LANGUAGE="JavaScript">

<maxtime;

window.name = maxtime;

}

else{

clearInterval(timer);

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

}

}

timer = setInterval("CountDown()",1000);

//-->

</SCRIPT>

<div id="timer"></div>

</body>

</html>

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

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

http://demo.jb51.net/js/2013/daojishi/index.htm

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类