HTML實現頁面自動跳轉的方法有哪些(例項)
- 網頁設計
- 關注:1.18W次
本文是本站小編搜尋整理的五個例項給大家介紹html如何實現頁面自動跳轉,感興趣的朋友一起學習吧!!想了解更多相關資訊請持續關注我們應屆畢業生考試網!
1)html的實現
程式碼如下:
<head>
<meta http-equiv="refresh" content="5;url=">
</head>
優點:簡單
缺點:Struts Tiles中無法使用
2)javascript的實現
程式碼如下:
<mce:script language="javascript" type="text/javascript"><!--
setTimeout("javascript:=''", 5000);
// --></mce:script>
優點:靈活,可以結合更多的'其他功能
缺點:受到不同瀏覽器的影響
3)結合了倒數的javascript實現(IE)
程式碼如下:
<span id="totalSecond">5</span>
<mce:script language="javascript" type="text/javascript"><!--
var second = rText;
setInterval("redirect()", 1000);
function redirect(){
rText=--second;
if(second<0) ='';
}
// --></mce:script>
優點:更人性化
缺點:firefox不支援(firefox不支援span、p等的innerText屬性)
3 )結合了倒數的javascript實現(firefox)
程式碼如下:
<mce:script language="javascript" type="text/javascript"><!--
var second = lementById('totalSecond')Content;
setInterval("redirect()", 1000);
function redirect()
{
lementById('totalSecond')Content = --second;
if (second < 0) ='';
}
// --></mce:script>
4)解決Firefox不支援innerText的問題
程式碼如下:
<span id="totalSecond">5</span>
<mce:script language="javascript" type="text/javascript"><!--
if(xOf("Explorer") > -1){
lementById('totalSecond')rText = "my text innerText";
} else{
lementById('totalSecond')Content = "my text textContent";
}
// --></mce:script>
5)整合3)和3')
程式碼如下:
<span id="totalSecond">5</span>
<mce:script language="javascript" type="text/javascript"><!--
var second = lementById('totalSecond')Content;
if (xOf("Explorer") > -1)
{
second = lementById('totalSecond')rText;
} else
{
second = lementById('totalSecond')Content;
}
setInterval("redirect()", 1000);
function redirect()
{
if (second < 0)
{
='';
} else
{
if (xOf("Explorer") > -1)
{
lementById('totalSecond')rText = second--;
} else
{
lementById('totalSecond')Content = second--;
}
}
}
// --></mce:script>
- 文章版權屬於文章作者所有,轉載請註明 https://xuezhezhai.com/zh-tw/sjzz/sjzz/z4pejn.html