頁面停滯一段時間後自動跳轉別的頁面
阿新 • • 發佈:2019-02-05
第一種方法:使用Meta
用法: <Meta http-equiv=Refresh Content=30>
<Meta http-equiv="Refresh" Content="5; Url=http://sc.jb51.net">
其中第一條語句是停留30秒自動重新整理,第二條是停留5秒轉向sc.jb51.net。分別使用可實現自動重新整理或自動轉向功能。
第二種:js實現
setTimeout(function(){window.location.href = 'http://sc.jb51.net';},2000)
第三種帶倒計時的js程式碼
程式碼如下:
<html>
<head>
<title>10秒後跳轉</title>
</head>
<body>
<input type="text" readonly="true" value="10" id="time">
</body>
<script language="javascript">
var t = 10;
var time = document.getElementById("time");
function fun(){
t--;
time.value = t;
if(t<=0){
location.href = "http://www.jb51.net";
clearInterval(inter);
}
}
var inter = setInterval("fun()",1000);
</script>
</html>
頁面跳轉功能當然也可以用js來實現,不過上面的程式碼的優點就是瀏覽不支援js的情況下,也可以使用。如果實現實時的倒計時效果,就需要用js來實現了,一般情況下,可以兩者結合判斷下。
用法: <Meta http-equiv=Refresh Content=30>
<Meta http-equiv="Refresh" Content="5; Url=http://sc.jb51.net">
其中第一條語句是停留30秒自動重新整理,第二條是停留5秒轉向sc.jb51.net。分別使用可實現自動重新整理或自動轉向功能。
第二種:js實現
setTimeout(function(){window.location.href = 'http://sc.jb51.net';},2000)
第三種帶倒計時的js程式碼
程式碼如下:
<html>
<head>
<title>10秒後跳轉</title>
</head>
<body>
<input type="text" readonly="true" value="10" id="time">
</body>
<script language="javascript">
var t = 10;
var time = document.getElementById("time");
function fun(){
t--;
time.value = t;
if(t<=0){
location.href = "http://www.jb51.net";
clearInterval(inter);
}
}
var inter = setInterval("fun()",1000);
</script>
</html>
頁面跳轉功能當然也可以用js來實現,不過上面的程式碼的優點就是瀏覽不支援js的情況下,也可以使用。如果實現實時的倒計時效果,就需要用js來實現了,一般情況下,可以兩者結合判斷下。