JavaScript实现x秒后自动跳转到一个页面
发布时间:2024-04-18 10:00:55
标签:页面跳转,跳转
今天看视频学习时学习了一种新技术,即平时我们在一个页面点击“提交”或“确认”会自动跳转到一个页面。
在网上搜了一下,关于这个技术处理有多种方法,我只记下我在视频里学到的三种:
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.hualai.net.cn", 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://www.hualai.net.cn/news/knowledge/265.html");
</script>
此方法实现的效果为在上一个页面点击完submit后跳转到本页面经过3秒(这个3会递减到0)后跳转到目标页面。


猜你喜欢
- 今天去辛集买箱包,下午挺晚才回来,又是恶心又是头痛。恶心是因为早上吃坏东西+晕车+回来时看到车祸现场,头痛大概是烈日和空调混合刺激而成。没有
- 目录1、简介2、正文2.1 and操作符2.2 or操作符2.3 in操作符2.4 not操作符2.5 操作符顺序1、简介在MySQL中使用
- 需要准备的环境:一个B站账号,需要先登录,否则不能查看历史弹幕记录联网的电脑和顺手的浏览器,我用的ChromePython3环境以及requ
- 在 python 代码中可以看到一些常见的 trick,在这里做一个简单的小结。json 字符串格式化在开发 web 应用的时候经常会用到
- 输入字母验证码,俺觉得特烦,特别还要输入大写字母。于是找到文件并修改成数字验证码。 修改文件 验证码文件位置 include\va
- 利用ASP从远程服务器上接收XML数据<% dim objXML dim objRootElement dim&n
- progress库安装和介绍1.安装progress库progress是Python第三方库,在终端执行 pip 命令安装。pip inst
- 1 构建 顺序依据词法名顺序 当导入一个包,且这个包 定义了 init(), 那么导入时init()将被执行。具体执行顺序: 全局变量定义时
- 本节笔者主将要介绍Active Server Page的另一对象Response,Response对象的作用是在向浏览器发送数据。将Resp
- 图像标注在计算机视觉中很重要,计算机视觉是一种技术,它允许计算机从数字图像或视频中获得高水平的理解力,并以人类的方式观察和解释视觉信息。注释
- 之前有看过一个博文写的是白社会的设计很好但运营却有些遭,因为对每一个WebGame的推出时间把握不准,会有几个应用同时上线造成影响力的冲突,
- 前言python使用中多线程、多进程、多协程使用是比较常见的。那么如果在多线程等的使用,我们这个时候我们想从外部强制杀掉该线程请问如何操作?
- public static char doVerify(String id) { char pszSrc[]=id.toCharArray(
- DDPDistributed Data Parallel 简称 DDP,是 PyTorch 框架下一种适用于单机多卡、多机多卡任务的数据并行
- 了解blockchain的概念很简单(区块链,交易链块):它是分布式的(即不是放置在同一台机器上,不同的网络设备上的)数据库支持主办记录日益
- 如何用WSH获取机器的IP配置信息?我们用VBSCRIPT转换了: Option Explicit Dim&n
- 介绍我们用django在本地调试完了之后,会在服务器上进行部署,如果是大佬那就忽略本文章,如果是萌新对编程命令不太熟悉,那就要用到宝塔了。流
- 首先:文章用到的解析库介绍BeautifulSoup:Beautiful Soup提供一些简单的、python式的函数用来处理导航、搜索、修
- 1.列表(本部分内容出入官方文档)对于这个功能,微信小程序中并没有提供类似于Android中listview性质的控件,所以我们需要使用 w
- 本文实例为大家分享了FormData上传多个文件的具体代码,供大家参考,具体内容如下由于项目中使用到,特此写个Demohtml代码:<