源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

基于JavaScript实现定时跳转到指定页面

  • 时间:2021-09-05 02:40 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:基于JavaScript实现定时跳转到指定页面
在某些场景下,需要网页在指定的时间后,网页能够自动跳转到指定页面,比如在无法找到指定网页的情况下,就会显示之前设置好的404页面,并且跳转到指定的页面,下面就是一段代码实现了此效果。 代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.1sucai.cn/" />
<title>js指定时间之后跳转到指定页面代码实例</title> 
<script type="text/javascript">
function redirect()
{
if(second<0)
{
location.href='http://wwww.1sucai.cn';
} 
else
{
if(navigator.appName.indexOf("Explorer")>-1)
{
document.getElementById('totalSecond').innerText=second--;
} 
else
{
document.getElementById('totalSecond').textContent=second--;
}
}
}
window.onload=function()
{
var second=document.getElementById('totalSecond').textContent;
if(navigator.appName.indexOf("Explorer")>-1)
{
second=document.getElementById('totalSecond').innerText;
} 
else
{
second = document.getElementById('totalSecond').textContent;
}
setInterval("redirect()",1000);
}
</script>
</head>
<body>
<h1>找不到指定的页面</h1>
<span id="totalSecond">3</span>秒后自动跳转到指定页面
</body>
</html>
以上代码,可以在三秒之后跳转到指定的页面,下面简单介绍一下实现过程。 [b]一.实现原理:[/b] 使用定时器函数,每隔一秒修改一次span元素中的数字,当数字到达零之后,就会将页面跳转到指定的链接,原理大致如此,这里就不多介绍了,具体可以参阅代码注释。 [b]二.代码注释:[/b] 1.function redirect(){},声明一个含糊,用于跳转。 2.if(second<0) {location.href='http://wwww.1sucai.cn';} ,如果数字小于零,那么就会跳转。 3.else{},否则进行倒计时效果。 4.if(navigator.appName.indexOf("Explorer")>-1),判断是否是IE浏览器。 5.document.getElementById('totalSecond').innerText=second--,如果是IE浏览器则使用innerText属性设置span元素中的数字值。 6.document.getElementById('totalSecond').textContent=second--,其他浏览器使用textContent属性设置span元素中的数字值。 7.window.onload=function(){},当文档完全加载完毕再去执行函数中的代码。 8.if(navigator.appName.indexOf("Explorer")>-1){},如果是IE浏览器则使用innerText属性获取span元素中的内容。 9.second = document.getElementById('totalSecond').textContent,其他标准浏览器使用textContent属性获取span元素值。 10.setInterval("redirect()",1000),每隔一秒执行一次定时器函数。 [b]三.相关阅读:[/b] 1.indexof()函数可以参阅[url=http://www.1sucai.cn/article/67363.htm]JavaScript中的lastIndexOf()方法使用详解[/url]一章节。 2.setInterval()函数可以参阅[url=http://%20http://www.1sucai.cn/article/43309.htm]setInterval()和setTimeout()的用法和区别[/url]示例介绍一章节。 以上内容是小编给大家分享的基于JavaScript实现定时跳转到指定页面的全部叙述,希望大家喜欢。
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部