如何實現在指定的時間後網頁實現跳轉

admin發表於2017-02-19
有時候可能需要這樣的功能,那就是網頁在指定的時間間隔後實現跳轉,下面就提供一個javascript實現的簡單例項供大家參考。

程式碼例項如下:

[HTML] 純文字檢視 複製程式碼
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>網頁跳轉效果</title>
<style type="text/css">
.mytest{
  color:red;
}
</style>
</head>
<script type="text/javascript">
window.onload=function(){
  var timer=document.getElementById("timer");
  var shijian=20;
  var flag;
  function daoji()
  {
if(shijian>0){
   shijian=shijian-1;
   timer.innerHTML=shijian
    }
else{
   clearInterval(flag);
   location.href="http://www.softwhy.com";
}
  }
  flag=setInterval(daoji,1000);
}
</script>
<body>
網頁在20秒後實現跳轉<span id="timer" style="color:red"></span>
</body>
</html>

以上程式碼實現了我們的需求,能夠實時的顯示倒數計時效果,在倒數計時到達零的時候可以實現跳轉。

相關文章