【转】几秒钟跳转页面动态显示时间

最新推荐文章于 2019-08-18 10:04:40 发布

原创最新推荐文章于 2019-08-18 10:04:40 发布 · 177 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#java #javascript #ViewUI

jsp 专栏收录该内容

11 篇文章

订阅专栏

本文介绍了一种使用HTML和JavaScript实现的自动页面跳转方法。通过设置`meta`标签的`http-equiv`属性为`refresh`并指定跳转时间及目标URL，结合JavaScript动态更新倒计时，实现了用户在完成某操作后自动跳转到另一个页面的功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

实现起来很简单，注意

1.在头部加

2.在javascript加：

3.在页面加：

<div id="layer">3</div>秒后跳转到登录页面，如果没有跳转请点击<a href="login.jsp">这里</a>

这是原页面的Code:

[java]view plaincopy
<%@ page language="java" import="java.util.*" pageEncoding="GBK"%>  
<%  
String path = request.getContextPath();  
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";  
%>  
  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
<html>  
  <head>  
    <base href="<%=basePath%>">  
      
    <title>错误</title>  
    <meta http-equiv="refresh" content="3;url=../login.jsp">  
      
    <meta http-equiv="pragma" content="no-cache">  
    <meta http-equiv="cache-control" content="no-cache">  
    <meta http-equiv="expires" content="0">      
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">  
    <meta http-equiv="description" content="This is my page">  
    <!--  
    <link rel="stylesheet" type="text/css" href="styles.css" mce_href="styles.css">  
    -->  
    <mce:script type="text/javascript">  
                <!--最初的时间-->  
        var time = 4;  
        <!--动态时间的显示函数-->  
        function returnUrlByTime() {  
            <!--每隔1秒调用该函数-->  
            window.setTimeout('returnUrlByTime()', 1000);  
            <!--时间递减-->  
            time = time - 1;  
            <!--显示动态时间的层-->  
            document.getElementById("layer").innerHTML = time;   
        }  
      
// --></mce:script>  
  </head>  
        
  <body onload="returnUrlByTime()">  
    <div>  
        <center><%=request.getAttribute("message") %></center>  
        <center><div id="layer">3</div>秒后跳转到登录页面，如果没有跳转请点击<a href="login.jsp" mce_href="login.jsp">这里</a></center>  
    </div>  
  </body>  
</html>  