zoukankan      html  css  js  c++  java
  • HTML 重定向 页面跳转

    通过响应头重定向

    响应状态 301 和 302 可以指定重定向URL, 推荐使用302 FOUND

    HttpServletResponse. static final int SC_MOVED_TEMPORARILY

    状态代码(302),指示资源已临时移动到另一个位置,但未来的引用仍应使用原始URI来访问资源。 保留此定义是为了向后兼容。 SC_FOUND现在是首选定义。

    <%@ page language="java" contentType="text/html; charset=UTF-8"
    	pageEncoding="UTF-8"%>
    <!DOCTYPE HTML>
    <%
    	/* 重定位状态分两种:
    		永久301 Moved Permanently和暂时302 Found
    		谨慎使用永久转移
    	*/
    	//response.setStatus(HttpServletResponse.SC_MOVED_TEMPORARILY);
    	response.setStatus(HttpServletResponse.SC_FOUND);
    	response.setHeader("Location", "indexs.jsp");
    %>
    

    通过元数据 meta 跳转页面

    该方式可向用户显示提示信息, 推荐使用

    注意, 如果refresh间隔时间太短或太长都会对用户造成困扰

    <!DOCTYPE HTML>
    <html lang="zh">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    
    <!-- 3秒后跳转页面 -->
    <meta http-equiv="refresh" content="2;url='https://www.google.com'">
    
    <title>3秒后进入主题</title>
    <link rel="icon" href="icon/icon.ico">
    <link rel="stylesheet" href="css/global.css">
    
    <body>
    	<p style="text-align: center;">
    		<a href="https://www.google.com">点击立即进入</a>
    	</p>
    </body>
    </html>
    

    事件 + JS 实现跳转

    向 window 添加 onload 事件监听, 并重定位 document.location 到新的页面

    该方法灵活性较高

    • 立即跳转
      在栈中不会有跳转页面
    <script>
    	window.addEventListener("load", function (){
    		(window/document).location.(href) = "/speedtest"
    	});
    </script>
    
    <!-- 事实上这是多余的, 并且每个浏览器行为不一致, 可直接跳转 -->
    
    <script>
    		document.location = "/speedtest"
    </script>
    
    • 延迟跳转
      堆栈会留下跳转页面, 停留1s最佳
    <script>
    	setTimeout(function () {
    			document.location = "/"
    	}, 1000)
    </script>
    
  • 相关阅读:
    js 数据格式化
    js 获取URL中参数
    微信公众平台JSSDK开发
    js 日期格式化及日期增减
    一句话的设计模式
    微信小程序开源项目库汇总
    bash 配置文件
    centos 设置时间为北京时间
    数据库一般数据的查询操作
    linux tmux 工具使用 tmux.conf 文件
  • 原文地址:https://www.cnblogs.com/develon/p/10706320.html
Copyright © 2011-2022 走看看