js实现网页多少秒后自动跳转到指定网址
在网上搜了一下,关于这个技术处理有多种方法,我只记下我在视频里学到的三种:
1、用一个response.sendRedirect("目标页面.jsp\.htm");实现直接跳转;
2、有时我们需要有点提示,比如“x秒后自动跳转,若没有跳转,请点击此处”,则可以在myeclipse中调用Snippets中的Delay Go To URL.会自动生成如下代码:
代码如下:
<script language="JavaScript1.2" type="text/javascript">
<!--
// Place this in the 'head' section of your page.
function delayURL(url, time) {
setTimeout("top.location.href='" + url + "'", time);
}
//-->
</script>
<!-- Place this in the 'body' section -->
<a href="javascript:" onClick="delayURL('myPage.html','2000')">My Delayed Link</a>
将此代码修改为:
代码如下:
<script language="JavaScript1.2" type="text/javascript">
function delayURL(url, time) {
setTimeout("top.location.href='" + url + "'", time);
}
</script>
<span id="time" style="background: red">3</span>
秒钟之后自动跳转,如果不跳转,请点击下面链接
<a href="目标页面.jsp">目标页面</a>
<script type="text/javascript">
delayURL("http://www.ablanxue.com", 3000);
</script>
然后将在3秒钟之后直接跳转到“目标页面”。这种方法就是设定几秒钟后跳转则在这过程中页面不会有变化,比如说设定3秒,然后随着时间的变化3变成2再变成1直至跳转,下面请看第三种方法。
3、把方法2中的代码修改为:
代码如下:
<script language="JavaScript1.2" type="text/javascript">
function delayURL(url) {
var delay=document.getElementById("time").innerHTML;
//最后的innerHTML不能丢,否则delay为一个对象
if(delay>0){
delay--;
document.getElementById("time").innerHTML=delay;
}else{
window.top.location.href=url;
}
setTimeout("delayURL('" + url + "')", 1000);
//此处1000毫秒即每一秒跳转一次
}
</script>
<span id="time" style="background: red">3</span>
秒钟之后自动跳转,如果不跳转,请点击下面链接
<a href="目标页面.jsp">主题列表</a>
<script type="text/javascript">
delayURL("http://pic.ablanxue.com");
</script>
此方法实现的效果为在上一个页面点击完submit后跳转到本页面经过3秒(这个3会递减到0)后跳转到目标页面。
js实现网页多少秒后自动跳转到指定网址的更多相关文章
- JS n秒后自动跳转实例
<p><a href="<?php echo base_url();?>usercenter/index" id="message" ...
- js弹框3秒后自动消失
开发中有时候会需要最出弹框后,过几秒自动消失的效果,下面给大家分享一下我自己做的一个小案例. 案例中的弹框使用的是bootstrap里面的模态框,实现自动消失则用的是js中的setInterval方法 ...
- html页面3秒后自动跳转的方法有哪些
在进行web前端开发实战练习时,我们常常遇到一种问题就是,web前端开发应该如何实现页面N秒之后自动跳转呢?通过查找相关html教程,总结了3个方法: 方法1: 最简单的一种:直接在前面<hea ...
- HTML页面3秒后自动跳转的三种常见方法
在练习中,我们常常遇到一种问题就是,怎么实现页面N秒之后自动跳转呢? 我自己遇到问题和查找资料,总结了3个方法 方法1: 最简单的一种:直接在前面<head>里面添加代码: 复制代码 代 ...
- 3秒后自动跳转页面【js】
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- js实现多少秒后自动跳转
第一种使用SetInterval: $(function () { setInterval(ChangeTime, 1000); }); function ChangeTime() { var tim ...
- 微信小程序页面3秒后自动跳转
setTimeout() 是属于 window 的方法,该方法用于在指定的毫秒数后调用函数或计算表达式. 语法格式可以是以下两种: setTimeout(function () { // wx.r ...
- 拦截器springmvc防止表单重复提交【3】3秒后自动跳回首页【重点明白如何跳转到各自需要的页面没有实现 但是有思路】
[1]定义异常类 [重点]:异常类有个多参数的构造函数public CmsException(String s, String... args),可以用来接受多个参数:如(“异常信息”,“几秒跳转”, ...
- 两种方法实现js页面隔几秒后跳转,及区别
这里需要用到window的两个对象方法,setInterval()和setTimeout() 一. 区别: 1. setInterval(code,millisec) 周期性(millisec单位 ...
随机推荐
- hdu 4778 Gems Fight! 状压dp
转自wdd :http://blog.csdn.net/u010535824/article/details/38540835 题目链接:hdu 4778 状压DP 用DP[i]表示从i状态选到结束得 ...
- msp430项目编程50
msp430综合项目---gsm无线采集传输平台系统50 1.电路工作原理 2.代码(显示部分) 3.代码(功能实现) 4.项目总结
- 再看c语言之getchar/putchar
- Redis的内部运作机制
本文将分五个部分来分析和总结Redis的内部机制,分别是:Redis数据库.Redis客户端.Redis事件.Redis服务器的初始化步骤.Redis命令的执行过程. 首先介绍一下Redis服务器的状 ...
- 在ScrollView添加一个ListView造成的滚动问题的简单解决办法()
正常来说,在ScrollView添加一个ListView后在真机上只会显示ListView的一行多一点,我也不理解为什么会这样,后来我把ListView的layout_height改成400dip,而 ...
- js中window.location.search的用法和作用
用该属性获取页面 URL 地址: window.location 对象所包含的属性 属性 描述 hash 从井号 (#) 开始的 URL(锚) host 主机名和当前 URL 的端口号 hostnam ...
- Maven的相关问题(一)——settings.xml配置详解
工作中第一次正式接触maven,虽然之前在学习时有遇到过,但是对于maven的认识和理解确实太浅薄,仅仅局限于机械式的操,纸上得来终觉浅,绝知此事要躬行···古人诚不欺我也~ 下面先贴一个找到的一个非 ...
- 关于android分享(sharedsdk的简单使用)
老早就使用了.可是如今才写,惰性太大,如今改 如今做产品的话相信大家基本都做分享吧.一个是项目的需求须要,另一个是能够非常好的宣传自己的产品.其它的优点依据情况而论 事实上每一个平台都有它自己的文档, ...
- chromium爱好者不可错过的一个开源分支
这次我要推荐下http://bloomberg.github.com/chromium.bb, 名字就叫chromium.bb,特点是专门的windows ports,关键是极大的简化了原版chrom ...
- SolidEdge 工程图中如何显示彩色工程图
点击这个按钮,然后更新视图 效果如下图所示,注意如果你的装配图(.dft文件)是单独拷贝出来的,装配图所引用的零件无法追溯到,则无法渲染这些零件,因此无法制作彩色工程图.