php倒计时跳转页面,JavaScript_javascript实现倒计时跳转页面,很多网页都有类似的效果,那 - phpStudy...

javascript实现倒计时跳转页面

很多网页都有类似的效果,那就是经过指定的时间能够跳转到其他页面,如果再人性化一点话,会带有倒计时效果,本章节就介绍一下如何实现此效果,代码实例如下:

var t=10;

setInterval("refer()",1000);

function refer(){

if(t==0){

location.href="";

}

document.getElementById('show').innerHTML=""+t+"秒后跳转到phpstudy";

t--;

}

以上代码实现了我们想要的效果,能够在10秒之后跳转到指定页面,下面介绍一下实现过程。

一.实现原理:

原理非常的简单,就是利用setInterval()定时器函数,每秒执行一次refer()函数,此函数能够没执行一次将t减1,同时将当前的t的值写入div中,如果t减到0,也就是倒计时完毕,就跳转到指定页面。原理大致如此。

二.相关阅读:

1.setInterval()函数可以参阅setInterval()函数用法详解一章节。

2.location.href可以参阅Location对象的href属性一章节。

3.innerHTML属性可以参阅js的innerHTML属性的用法一章节。

下面给大家分享2个简单的跳转代码,做一下总结,各种定时跳转代码记录如下:

(1)使用setTimeout函数实现定时跳转(如下代码要写在body区域内)

//3秒钟之后跳转到指定的页面

setTimeout(window.location.href='',3);

(2)html代码实现,在页面的head区域块内加上如下代码

相关阅读:

在Linux系统上安装配置DNS服务器的教程

Struts2学习笔记(4)-通配符的使用

jquery滚动特效集锦

HTML5 画布canvas使用方法

动态的样式语言less语法详解之混合属性

快速解决FusionCharts联动的中文乱码问题

vmware虚拟机中ubuntu标题栏显示不全怎么办?

asp.net Gridview分页保存选项

android应用签名详细步骤

Winform启动另一个项目传值的方法

C++编程中的格式化输出详解

微信支付java版本之JSAPI支付+发送模板消息

PHP Streams(流)详细介绍及使用

SQL字符串以及数字常用操作汇总

你可能感兴趣的:(php倒计时跳转页面)