<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

posted on 2020-08-26 14:56 王多静阅读(739) 评论(0) 编辑收藏举报

刷新页面返回顶部

登录后才能查看或发表评论，立即登录或者逛逛博客园首页

阅读排行：
· 无需6万激活码！GitHub神秘组织3小时极速复刻Manus，手把手教你使用OpenManus搭建本
· Manus爆火，是硬核还是营销？
· 终于写完轮子一部分：tcp代理了，记录一下
· 别再用vector＜bool＞了！Google高级工程师：这可能是STL最大的设计失误
· 单元测试从入门到精通

历史上的今天：
2019-08-26 给<label>点击事件时, 竟然点击了两次

王多静

导航

统计

公告

搜索

常用链接

我的标签

随笔档案

阅读排行榜

评论排行榜

推荐排行榜

最新评论

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