js倒计时实现页面跳转的例子

发布时间:2020-08-15编辑:脚本学堂
有关js实现页面定时跳转的方法,js倒计时效果的实现,使用setinterval或settimeout函数,也可以使用html meta实现,具体参考文中js效果代码。

例1,js倒计时实现页面跳转
 

复制代码 代码示例:

<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倒计时网页自动跳转代码 - www.jb200.com</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.jb200.com">我的百度</a>
<script type="text/javascript">
delayurl("http://www.jb200.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.jb200.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>