京东6.18大促主会场领京享红包更优惠

 找回密码
 立即注册

QQ登录

只需一步,快速开始

延时(倒计时)页面跳转功能

2024-10-28 15:06| 发布者: zhaojun917| 查看: 46| 评论: 0

摘要: 在我们开发网站时通常要用到页面的跳转,当然跳转的时候就会分为瞬时跳转和延时跳转,延时跳转中还有倒计时跳转。下面就来说说实现方式。瞬时跳转2种方法:第一种通过内置函数:header("location:ycphp.php");exit() ...

在我们开发网站时通常要用到页面的跳转,当然跳转的时候就会分为瞬时跳转和延时跳转,延时跳转中还有倒计时跳转。下面就来说说实现方式。

瞬时跳转2种方法:

第一种通过内置函数:header("location:ycphp.php");exit(); 需要注意后面的exit()必须加上。

第二种通过JavaScript脚本:<script>location.href='ycphp.php'</script>。

延时跳转方法:

第一种方法不显示倒计时,

<script language='javascript'>
    setTimeout("location.href='http://www.ycphp.net',3000");
</script>

或者

<meta http-equiv="refresh" content="3;url=http://www.ycphp.net">
content属性里的“3”指明延迟3秒后跳转,中间用分号隔开,后面紧跟着的url指明要跳转到的页面链接,忽略则跳转到当前页面(相当于刷新)。
或者

header("Refresh:3;url=ycphp.php");//3秒延时跳转

第二种倒计时跳转实现方法通过JS实现:

<div style="margn:20% 40%;padding:20% 40%">
正在跳转还有<span id="ycphp" style="color:#FF0000;">3</span>秒钟自动跳转到文章列表,如果没有跳转请点击
<a href="article.php?act=list" style="color:red;">这里</a>
</div>
<script language="javascript">
    function runtime() {
     document.getElementById('ycphp').innerHTML=document.getElementById('ycphp').innerHTML-1;
     if(document.getElementById('ycphp').innerHTML==0) {
      location.href='article.php?act=list';
     }
     setTimeout("runtime()",1000);
    }
    runtime();
</script>

关闭

站长推荐上一条 /6 下一条

QQ|手机版|小黑屋|梦想之都-俊月星空 ( 粤ICP备18056059号 )|网站地图

GMT+8, 2025-7-1 17:19 , Processed in 0.046733 second(s), 18 queries .

Powered by Mxzdjyxk! X3.5

© 2001-2025 Discuz! Team.

返回顶部