JavaScript实现时间倒计时跳转(推荐)_javascript技巧

1. setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式。

setTimeout() 只执行 code 一次。如果要多次调用,请使用 setInterval() 或者让 code 自身再次调用 setTimeout()。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>setTimeout</title>
</head>
<body>
<div id='div1'> </div>
</body>
</html>
<script type="text/javascript">
//设定倒数秒数
var t = 10;
//显示倒数秒数
function showTime(){
t -= 1;
document.getElementById('div1').innerHTML= t;
if(t==0){
location.href='http://www.baidu.com';
}
//每秒执行一次,showTime()
setTimeout("showTime()",1000);
}
//执行showTime()
showTime();
</script> 

2.setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。

setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。

<html>
<body>
<input type="text" id="clock" size="35" />
<script language=javascript>
var int=self.setInterval("clock()",50)
function clock()
{
var t=new Date()
document.getElementById("clock").value=t
}
</script>
</form>
<button onclick="int=window.clearInterval(int)">
Stop interval</button>
</body>
</html>

下面给大家介绍下相关阅读

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

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

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

下面通过示例(example)给大家介绍下 :

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js定时跳转页面的方法</title>
</head>
<body>
<script type="text/javascript">
var t=10;//设定跳转的时间
setInterval("refer()",1000); //启动1秒定时
function refer(){
if(t==0){
location="www.baidu.com"; //#设定跳转的链接地址
}
document.getElementById('show').innerHTML=""+t+"秒后跳转"; // 显示倒计时
t--; // 计数器递减
}
</script>
<span id="show"></span>
</body>
</html> 

遇到的问题:

当将上述js 的方法 放在$(function(){......})中时, 浏览器会报 methodXX() is not defined;

应当将function(){}的定义放在 <script></script>中

以上所述是小编给大家介绍的JavaScript实现时间倒计时跳转(推荐),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索js倒计时跳转
javascript倒计时跳转、javascript实现倒计时、javascript 实现跳转、javascript倒计时代码、javascript 倒计时,以便于您获取更多的相关知识。

时间: 2024-11-03 08:31:17

JavaScript实现时间倒计时跳转(推荐)_javascript技巧的相关文章

javascript实现倒计时跳转页面_javascript技巧

很多网页都有类似的效果,那就是经过指定的时间能够跳转到其他页面,如果再人性化一点话,会带有倒计时效果,本章节就介绍一下如何实现此效果,代码实例如下: <script type="text/javascript"> var t=10; setInterval("refer()",1000); function refer(){ if(t==0){ location.href="http://www.jb51.net"; } docume

javascript实现时间格式输出FormatDate函数_javascript技巧

本文实例讲述了javascript实现时间格式输出FormatDate函数.分享给大家供大家参考.具体如下: javascript没有提供像fmt标签一样对日期时间型内容格式输入的函数: 下面是我下的时间输出函数,使用时直接放到标签内,调用.代码如下 复制代码 代码如下: Date.prototype.Format = function(fmt) { //author: meizz         if (this == "Invalid Date") {          retur

javascript数字验证的实例代码(推荐)_javascript技巧

现在有一个需求如下图: 产品经理说Card Number只能让输入数字(中间的空格是格式自加的,也是用js实现的),有时候我脑海中出现了个声音,啥玩意,加个type=number不就行了,事实发现图样图森破了,先不说type=number后面会有个上下标(虽然用css可干掉),但是这个类型是支持科学输入法的,就是小数点和e这样的是可以输入的,于是乎只能用其他的方式了,后来想用检索到输入了非数字就干掉,但是这样还是能输入,想法被打回,于是乎最终采用了键盘输入控制的办法,其实很简单, 代码如下: v

JavaScript 数组- Array的方法总结(推荐)_javascript技巧

JavaScript中的Array类型是经常用到的,Array类型也提供了很多方法能实现我们需求,下面我们来总结一下 一.创建Array的方法 var colors=new Array(); var colors=new Array(3);//创建一个长度为3的数组 var colors=new Array("red","blue")//创建一个数组["red","blue"] 当然,上面的new可以省略不写,如 var co

再谈Javascript中的基本类型和引用类型(推荐)_javascript技巧

一.基本类型和引用类型概述 js中数据类型的值包括:基本类型值和引用类型值 基本数据类型:undefined;null;boolean;number;string 引用类型值:保存在内存中,js不允许直接访问内存位置,因此时操作引用而不是实际对象 二.如何检测数据类型 1.基本数据类型的检测:使用typeof var s = "AAA"; alert(typeof s); //返回string 2.引用类型(对象类型)检测:使用instanceof alert(person insta

浅析JavaScript Array和string的转换(推荐)_javascript技巧

Array类可以如下定义: var aValues = new Array();  如果预先知道数组的长度,可以用参数传递长度 var aValues = new Array(20);  ------------------如下2种定义方式是一样的--------1------- var aColors = new Array(); aColors[0] = "red"; aColors[1] = "green"; aColors[2] = "blue&q

使用JavaScript解决网页图片拉伸问题(推荐)_javascript技巧

问题描述 这段时间在做PM的需求的时候突然发现一个问题,产品上的图片来自多个第三方,具体的尺寸无法确定,如果直接在样式中写死图片的尺寸大小就会出现图片拉伸的现象,十分影响产品的美观,因此希望可以找到一个比较好的解决方案.自己先做了一个简单的demo来展示问题. <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <

js几秒以后倒计时跳转示例_javascript技巧

复制代码 代码如下: <html> <head> <title>出错啦~~~</title> <link href="css/login1.css" mce_href="css/login1.css" rel="stylesheet" type="text/css" /> <script language="javascript" type=

基于JavaScript实现网页倒计时自动跳转代码_javascript技巧

用JS实现网页上的自动跳转功能,倒计时跳转至指定网页,倒计时间可自设,时间到则自动跳转到指定的网址,对于JS来说,实现该似乎挺简单哦,用IIS上的301也可实现跳转,以及mete标签也可以实现自动跳转,根据你自己的需要了. <title>JS倒计时网页自动跳转代码</title> <script language="JavaScript" type="text/javascript"> function delayURL(url)