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单位 ...
随机推荐
- 家用电脑架服务器提供web
要搞一个可以对外的web服务,需要服务器,域名.这些都需要money,但有时,我们只是想自己可以在外面访问,或是提供给朋友看自己的网站有多牛.这时使用家用电脑配置一个可以提供web的服务器,就显得很必 ...
- Laravel 5.1 简单学习
Laravel 5.1 简单学习 (1)Laravel的nginx配置,不配置或者配置错误,可能会报404或500错误,访问不到页面. location / { try_files $uri $uri ...
- android自定义Activity窗体大小
先给大家看图吧: 看,是不是很酷呢,呵呵. 这里我说关键的地方,就是自定义Activity的窗体大小. 这个登录框它不是一个Dialog,而是一个Activity. 如何定义,即把Activity的主 ...
- 2017-10-29-morning-清北模拟赛
T1 遭遇 #include <algorithm> #include <cstdio> #include <cmath> inline void read(int ...
- [Bzoj1112][POI2008]砖块Klo(splay)
1112: [POI2008]砖块Klo Time Limit: 10 Sec Memory Limit: 162 MBSubmit: 2353 Solved: 831[Submit][Statu ...
- Codeforces 961 E Tufurama
Discription One day Polycarp decided to rewatch his absolute favourite episode of well-known TV seri ...
- idea抛异常方式
选中需要抛异常的行,按alt+enter或者ctrl+alt+t,然后上下键选择自己抛异常的方式即可,如下图:
- Hibernate 与Mybatis之比较
1. hibernate是全自动,而mybatis是半自动.hibernate完全可以通过对象关系模型实现对数据库的操作,拥有完整的JavaBean对象与数据库的映射结构来自动生成sql.而mybat ...
- 如何在ASP.NET Core自定义中间件中读取Request.Body和Response.Body的内容?
原文:如何在ASP.NET Core自定义中间件中读取Request.Body和Response.Body的内容? 文章名称: 如何在ASP.NET Core自定义中间件读取Request.Body和 ...
- Spring-boot和Spring-Cloud遇到的问题
1.spring cloud 使用 feign 启动报错 错误信息 org/springframework/cloud/client/loadbalancer/LoadBalancedRetryFa ...