使用javascript實現(xiàn)頁面定時跳轉(zhuǎn)總結(jié)篇
更新時間：2013年09月21日 12:14:40 作者：
下面對使用JavaScript實現(xiàn)頁面定時跳轉(zhuǎn)做一下總結(jié)，各種定時跳轉(zhuǎn)代碼記錄如下，希望對大家有所幫助
下面對使用JavaScript實現(xiàn)頁面定時跳轉(zhuǎn)（也稱倒計時跳轉(zhuǎn)）做一下總結(jié)，各種定時跳轉(zhuǎn)代碼記錄如下：
（1）使用 setTimeout 函數(shù)實現(xiàn)定時跳轉(zhuǎn)（如下代碼要寫在body區(qū)域內(nèi)）
<script type="text/javascript">
// 3秒鐘之后跳轉(zhuǎn)到指定的頁面
setTimeout(window.location., 3);
</script>
（2）html代碼實現(xiàn)，在頁面的head區(qū)域塊內(nèi)加上如下代碼
<!-- 5秒鐘后跳轉(zhuǎn)到指定的頁面 -->
<meta http-equiv="refresh" content="5;url=http://3aj.cn/javascript/19.html" />
（3）稍微復雜點，多見于登陸之后的定時跳轉(zhuǎn)
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js定時跳轉(zhuǎn)頁面的方法</title>
</head>
<body>
<script type="text/javascript">
var t = 10; // 設(shè)定跳轉(zhuǎn)的時間
setInterval("refer()", 1000); // 啟動1秒定時
function refer(){
if (t == 0) {
location = "http://3aj.cn/javascript/19.html"; // 設(shè)定跳轉(zhuǎn)的鏈接地址
}
document.getElementById('show').innerHTML = "" + t + "秒后跳轉(zhuǎn)到php程序員教程網(wǎng)"; // 顯示倒計時
t--; // 計數(shù)器遞減
}
</script>
<span id="show"></span>
</body>
</html>
（1）使用 setTimeout 函數(shù)實現(xiàn)定時跳轉(zhuǎn)（如下代碼要寫在body區(qū)域內(nèi)）
復制代碼 代碼如下:
<script type="text/javascript">
// 3秒鐘之后跳轉(zhuǎn)到指定的頁面
setTimeout(window.location., 3);
</script>
（2）html代碼實現(xiàn)，在頁面的head區(qū)域塊內(nèi)加上如下代碼
復制代碼 代碼如下:
<!-- 5秒鐘后跳轉(zhuǎn)到指定的頁面 -->
<meta http-equiv="refresh" content="5;url=http://3aj.cn/javascript/19.html" />
（3）稍微復雜點，多見于登陸之后的定時跳轉(zhuǎn)
復制代碼 代碼如下:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js定時跳轉(zhuǎn)頁面的方法</title>
</head>
<body>
<script type="text/javascript">
var t = 10; // 設(shè)定跳轉(zhuǎn)的時間
setInterval("refer()", 1000); // 啟動1秒定時
function refer(){
if (t == 0) {
location = "http://3aj.cn/javascript/19.html"; // 設(shè)定跳轉(zhuǎn)的鏈接地址
}
document.getElementById('show').innerHTML = "" + t + "秒后跳轉(zhuǎn)到php程序員教程網(wǎng)"; // 顯示倒計時
t--; // 計數(shù)器遞減
}
</script>
<span id="show"></span>
</body>
</html>
您可能感興趣的文章:
- JS在一定時間內(nèi)跳轉(zhuǎn)頁面及各種刷新頁面的實現(xiàn)方法
- 基于JavaScript實現(xiàn)定時跳轉(zhuǎn)到指定頁面
- ASP.NET中配合JS實現(xiàn)頁面計時（定時）自動跳轉(zhuǎn)
- javascript使用定時函數(shù)實現(xiàn)跳轉(zhuǎn)到某個頁面
- 等待指定時間后自動跳轉(zhuǎn)或關(guān)閉當前頁面的js代碼
- JS定時刷新頁面及跳轉(zhuǎn)頁面的方法
- Javascript倒計時（定時）執(zhí)行跳轉(zhuǎn)事件的代碼
- js跳轉(zhuǎn)頁面方法實現(xiàn)匯總
- js實現(xiàn)頁面跳轉(zhuǎn)重定向的幾種方式
- js跳轉(zhuǎn)頁面方法總結(jié)
- js 3秒后跳轉(zhuǎn)頁面的實現(xiàn)代碼
- JavaScript實現(xiàn)定時頁面跳轉(zhuǎn)功能示例
相關(guān)文章
echarts使用中關(guān)于y坐標軸無法正常顯示的問題解決記錄
Echarts是由百度提供的數(shù)據(jù)可視化解決方案,下面這篇文章主要給大家介紹了關(guān)于echarts使用中關(guān)于y坐標軸無法正常顯示的問題解決記錄,文中通過圖文介紹的非常詳細,需要的朋友可以參考下2023-12-12
JavaScript 字符串處理函數(shù)使用小結(jié)
JavaScript 字符串處理函數(shù)使用小結(jié)，學習js的朋友可以參考下。2010-12-12
js 彈出框 替代瀏覽器的彈出框,需要的朋友可以參考下。2010-10-10
layui中的switch開關(guān)實現(xiàn)方法
今天小編就為大家分享一篇layui中的switch開關(guān)實現(xiàn)方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
今天的這篇文章就分享幾年以來總結(jié)的一些最常見和最有用的字符串相關(guān)的方法的例子和簡要說明。便于程序員用于快速參考。當然，最有經(jīng)驗的開發(fā)人員對這些操作很熟悉，但我認為這是一個很好的方法幫助初學者理解這些函數(shù)，他可以幫助你使用簡單的語法,完成復雜的操作.2015-04-04
這篇文章主要介紹了JavaScript實現(xiàn)N皇后問題算法謎題解答,N皇后問題是指將N個皇后放置在NxN的國際象棋棋盤上,其中沒有任何兩個皇后處于同一行、同一列或同一對角線上,以使得它們不能互相攻擊,需要的朋友可以參考下2014-12-12
這篇文章主要為大家詳細介紹了JavaScript實現(xiàn)點擊圖片換背景，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-11-11
這篇文章主要為大家詳細介紹了js實現(xiàn)復選框全選與反選，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-10-10
javascript的事件觸發(fā)器介紹的實現(xiàn)
這篇文章主要介紹了javascript的事件觸發(fā)器介紹的實現(xiàn),本文所指觸發(fā)器是用程序來觸發(fā)綁定的事件,而不是人為的去觸發(fā),需要的朋友可以參考下2014-06-06
這篇文章主要介紹了javascript中Event 對象中的 on, off 方法，非常的簡單實用，有需要的小伙伴可以參考下2016-08-08