<meta>标签的定时跳转、刷新

需求场景:一般用到的不太多,暂时遇到的只有提交的时候,跳转到等待页面(里面有倒计时或者是一个图片倒计时gif)的时候

解决方法: 在该等待页面使用<meta>标签,或者js的定时方法

一   <meta>标签

<!---使用标签跳转 3秒后在本页面跳到新页面-->
<meta http-equiv="Refresh" content="3; URL=orderList.html">


<!---题外: 每隔30秒后刷新, 特别那种适合可视化数据分析, 每隔几秒几分钟, 刷新一下, 重获新数据-->
<meta http-equiv="Refresh" content="30">

这种方法, 我测的过程中, 没有看到浏览器的前进和返回 , 应该回退不了

二  js的setTimeout 或者setInterval

setTimeout(function(){
//    window.location.href="orderList.html";  // 在同当前窗口中打开窗口
    window.open("orderList.html"); // 新标签页打开
},3000)
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>第一个</title>
    </head>
    <body>
        第一个页面 测试3秒跳转orderList页面
        <button onclick="hanleskipPage()">点击</button>
        <script src="../jquery-2.1.4.min.js"></script>
        <script>
            // 到时间3秒
            function hanleskipPage(){
             setTimeout(function(){
//                 window.location.href="orderList.html";  // 在同当前窗口中打开窗口
                window.open("orderList.html"); // 如果浏览器不拦截的话 会新标签页打开 
             },3000)
            }
        </script>
    </body>
</html>
View Code

我用的setTimeout , 不会用setInterval ,大概这样

// 跳转
            function skipPage(){
                window.location.href="orderList.html";  // 在同当前窗口中打开窗口
            }
            
            // 每3秒 调用一次skipPage()函数 
            function hanleskipPage(){
                var num = setInterval(function(){
                    clearInterval(num); // 停止num的skipPage()函数的执行:
                     skipPage();
                },3000);
                
            }
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>第一个</title>
    </head>
    <body>
        第一个页面 测试3秒跳转orderList页面
        <button onclick="hanleskipPage()">点击</button>
        <script src="../jquery-2.1.4.min.js"></script>
        <script>
            // 跳转
            function skipPage(){
                window.location.href="orderList.html";  // 在同当前窗口中打开窗口
            }
            
            // 每3秒 调用一次skipPage()函数 
            function hanleskipPage(){
                var num = setInterval(function(){
                    clearInterval(num); // 停止num的skipPage()函数的执行:
                     skipPage();
                },3000);
                
            }
            
        </script>
    </body>
</html>
View Code

<meta>标签还有很多需要学的...

原文地址:https://www.cnblogs.com/wangduojing/p/13565199.html