zoukankan      html  css  js  c++  java
  • <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>标签还有很多需要学的...

  • 相关阅读:
    卷积神经网络与典型结构
    机器学习之信息熵
    机器学习读书笔记第三章(1):线性模型
    神经网络之:S型神经元
    mysql只保留一条有效数据,删除其他重复的数据
    mysql索引
    mysql自定义函数收集
    MySql中循环的使用
    WCF的例子
    C盘满了如何清理
  • 原文地址:https://www.cnblogs.com/wangduojing/p/13565199.html
Copyright © 2011-2022 走看看