在网上搜了一下,关于这个技术处理有多种方法,我只记下我在视频里学到的三种:

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实现网页多少秒后自动跳转到指定网址的更多相关文章

  1. JS n秒后自动跳转实例

    <p><a href="<?php echo base_url();?>usercenter/index" id="message" ...

  2. js弹框3秒后自动消失

    开发中有时候会需要最出弹框后,过几秒自动消失的效果,下面给大家分享一下我自己做的一个小案例. 案例中的弹框使用的是bootstrap里面的模态框,实现自动消失则用的是js中的setInterval方法 ...

  3. html页面3秒后自动跳转的方法有哪些

    在进行web前端开发实战练习时,我们常常遇到一种问题就是,web前端开发应该如何实现页面N秒之后自动跳转呢?通过查找相关html教程,总结了3个方法: 方法1: 最简单的一种:直接在前面<hea ...

  4. HTML页面3秒后自动跳转的三种常见方法

    在练习中,我们常常遇到一种问题就是,怎么实现页面N秒之后自动跳转呢? 我自己遇到问题和查找资料,总结了3个方法 方法1:  最简单的一种:直接在前面<head>里面添加代码: 复制代码 代 ...

  5. 3秒后自动跳转页面【js】

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. js实现多少秒后自动跳转

    第一种使用SetInterval: $(function () { setInterval(ChangeTime, 1000); }); function ChangeTime() { var tim ...

  7. 微信小程序页面3秒后自动跳转

    setTimeout() 是属于 window 的方法,该方法用于在指定的毫秒数后调用函数或计算表达式. 语法格式可以是以下两种:   setTimeout(function () { // wx.r ...

  8. 拦截器springmvc防止表单重复提交【3】3秒后自动跳回首页【重点明白如何跳转到各自需要的页面没有实现 但是有思路】

    [1]定义异常类 [重点]:异常类有个多参数的构造函数public CmsException(String s, String... args),可以用来接受多个参数:如(“异常信息”,“几秒跳转”, ...

  9. 两种方法实现js页面隔几秒后跳转,及区别

    这里需要用到window的两个对象方法,setInterval()和setTimeout() 一. 区别: 1.  setInterval(code,millisec)  周期性(millisec单位 ...

随机推荐

  1. ORACLE:除去回车符,换行符

    ORACLE:除去回车符,换行符 replace(fa,chr(),'') ; --- 除去回车符 replace(fa,chr(),'') ; --- 除去换行符  

  2. 魔法森林(bzoj 3669)

    Description 为了得到书法大家的真传,小E同学下定决心去拜访住在魔法森林中的隐士.魔法森林可以被看成一个包含个N节点M条边的无向图,节点标号为1..N,边标号为1..M.初始时小E同学在号节 ...

  3. PHPstorm注册码(7.1.3)

    UserName EMBRACE ===== LICENSE BEGIN ===== 18710-12042010 00000EsehCiFamTQe"7jHcPB16QOyk S" ...

  4. Codeforces Round #329 (Div. 2) D. Happy Tree Party(LCA+并查集)

    题目链接 题意:就是给你一颗这样的树,用一个$y$来除以两点之间每条边的权值,比如$3->7$,问最后的y的是多少,修改操作是把权值变成更小的. 这个$(y<=10^{18})$除的权值如 ...

  5. mysql workbench 导出建表语句

    导出建表语句和数据 server—–>data export—–>选中表  注意,export to dump project folder,这种方式是每个表对应一个sql文件.  导出建 ...

  6. Spring注入内部的Beans

    以下内容引用自http://wiki.jikexueyuan.com/project/spring/injecting-inner-beans.html: 如你所知,Java内部类在其他类的范围内定义 ...

  7. JAVA获取前一个月的第一天和最后一天

    package com.date; import java.text.SimpleDateFormat; import java.util.Calendar; /** * 默认显示前一个月的第一天和最 ...

  8. 【面试 springMVC】【第四篇】springMVC的一些问题

    1.springMVC的工作流程是什么样的 1.用户请求到达 2.DispatcherServlet接收请求,发送给处理器映射器 3.处理器映射器handlerMapping,处理找到对应处理器,返回 ...

  9. Android L中的RecyclerView 、CardView 、Palette的使用

    <Material Design>提到,Android L版本中新增了RecyclerView.CardView .Palette.RecyclerView.CardView为用于显示复杂 ...

  10. 【Todo】git的fast forward & git命令学习 & no-ff

    git的fast-forward在之前的文章有介绍过,但是介绍的不细: http://www.cnblogs.com/charlesblc/p/5953066.html fast-forward方式就 ...