javascript刷新页面后继续运行，不从头执行

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了javascript刷新页面后继续运行，不从头执行相关的知识，希望对你有一定的参考价值。

我有一个html页面，有两张图表，页面每次只显示一张图表，打算每五秒刷新一次页面（为了更新图表），然后页面显示下一张图表。
我现在一刷新页面就继续显示第一张图表了，并不切换图表。
希望大家可以给我具体的代码，谢谢。

var g1 = document.getElementById('g1');
var g2 = document.getElementById('g2');
var timer = null;
var a = true;

function change()

if (a)
g1.style.display = 'block';
g2.style.display = 'none';
a = false;
else
g1.style.display = 'none';
g2.style.display = 'block';
a = true;


timer = setInterval(change,5000);
忘了一点代码，，在if和else的最后还有一句 window.location.reload();

你定义的a变量没有传递到下一个页面，刷新之后获取不到
可以保存到cookie里或localStorage里
定义a的时从存储里取值，或默认值 如var a=localStorage["a"]||true;
这样就知道该显示哪个了

再说一下，你的延迟逻辑不对，页面都刷新了，你还去把某个设置为block有什么意义？
改成页面加载时运行方法，延迟函数只刷新页面。 参考技术A 你的需求涉及到了状态保持，通常是通过服务端传参实现的；如果没有服务端的话只能通过本地存储，或向url中传参进行状态的保持，这样页面每次刷新之后，就能知道要显示哪一张图表了 参考技术B 1、在body中用onload:

<body onload="myfunction()">

2、在脚本中用window.onload:

<script type="text/javascript">
function myfun()

alert("this window.onload");

/*用window.onload调用myfun()*/
window.onload=myfun;//不要括号
</script>

下面这个例子在页面完成加载之后改变id_1的背景颜色。

<script language="javascript" >
function myfun()
document.getElementById("id_1").style.background= "#000"; // 改变背景颜色

// 用js实现在加载完成一个页面后自动执行一个方法
/*用window.onload调用myfun()*/
window.onload=myfun;//不要括号
</script> 参考技术C     <div id = "g1"><img src="https://gss0.baidu.com/-vo3dSag_xI4khGko9WTAnF6hhy/pic/w%3D230/sign=91b5680396dda144da096bb182b7d009/95eef01f3a292df57d9c6005bd315c6034a87347.jpg"/></div>
<div id = "g2" style="display:none"><img src="https://gss0.baidu.com/-4o3dSag_xI4khGko9WTAnF6hhy/pic/w%3D230/sign=74d1f5d430adcbef013479059cae2e0e/5d6034a85edf8db16f60b0740823dd54564e7450.jpg"/></div>
<script>
var g1 = document.getElementById('g1');
       var g2 = document.getElementById('g2');
       var timer = null,ii=1;
       var a = location.search ? eval(location.search.substr(1)) :true;

change(1);

function change(c)
    g1.style.display = a ? "block" : "none";
    g2.style.display = a ? "none" : "block";
    
        if(!c)
            a=!a;
                location.replace("?"+a); 
         
        timer = setTimeout(change,3000);  
        
</script>

追问

问题解决了，我又加了50分，还想问下，如果我是三个图表该怎么改呢？谢谢

追答

不好意思，前两天太忙，没来知道。

  <style>divfont-size: 32px;</style>
    <div id = "g1">1</div>
<div id = "g2" style="display:none">2</div>
<div id = "g3" style="display:none">3</div>
<script>
function $(s)
  return document.getElementById(s);

       var timer = null,
       i=1,
       m=1,
       a = location.search ? location.search.substr(1) :1;

change(1);

function change(c)
  while($("g"+i))
      $("g"+i).style.display = i==a ? "block": "none";
      m=i;
      i++;
  
        if(!c)
            a++;
                location.replace("?"+(a>m?1:a)); 
         
        timer = setTimeout(change,3000);  
        
</script>

本回答被提问者采纳 参考技术D function change()
    if (a)            
         g1.style.display = 'block';
         g2.style.display = 'none';
         a = false;        
    else         
         //g1.style.display = 'none';//把这句注释掉
         g2.style.display = 'block';
         a = true;        
            

追问

？这是为什么，没有意义啊……

追答

你reload() 之后就一切都从头再来了~~~

追问

是，我发现了，但是我就知道这一种方法，还有别的刷新页面的方法么

追答

无论什么方法 只要刷新了整个页面，所有东西都得重新加载一遍

离开页面后php继续执行

【中文标题】离开页面后php继续执行【英文标题】：php continue execution after leaving the page 【发布时间】：2018-09-10 11:39:19 【问题描述】：

我有一个从 1 计数到 5000 的简单脚本，带有 for 循环。它将输出实时刷新到浏览器，并显示一个带有 % 的进度条。

我所拥有的：如果我离开页面，进程就会中断。如果我回来，它从0开始。

我想要实现的目标：如果我离开页面，流程会继续，如果我回来，它会显示正确的百分比。

示例：我运行该进程，它计数到 54，我离开页面 10 秒，当我回来时它显示 140 并继续刷新。

有可能吗？

【问题讨论】：

你必须让任务在一个完全独立的进程中运行，例如通过cron作业或其他东西。网页脚本仅用于监控进度。 我猜有一个会话是可能的。 @ADyson 但是如果我使用 cron job ，我如何在另一个监视执行的页面中捕获它的当前百分比？ 好吧，作业必须定期在某处写入当前状态，例如进入文本文件或数据库表或其他东西。然后网页可以定期从那里读取它。 【参考方案1】：

我建议您使用服务器工作者 - 旨在独立于网络服务器上下文运行的脚本。

最常用的方法是使用消息队列（RabbitMQ、Qless 等）。事件应该由 web 上下文中的脚本发起，但实际任务应该由队列侦听器在不同的上下文中执行。

【讨论】：

有趣.. 所以如果使用那些队列监听器，我是否能够在另一个页面中捕捉他们的进度并显示正确的百分比，即使离开页面？ @DregKorig，工人可以修改可以被网络脚本读取的状态。例如更改 Redis 或 DB 中的计数器。【参考方案2】：

您所问的问题似乎对会话很简单。 （纯粹假设给定的用例）。这不是在后台运行任何进程，它只是简单地跟踪时间并显示进度。这就是为什么我说“根据你的要求”。如果您想跟踪任何真正的后台任务，那么我相信情况会完全不同，您也必须更改问题的措辞；）

这样就可以了。

<?php
session_start();
$s = &$_SESSION;

$sleep = 1; //seconds

//check if we have a value set in session before, if not set default = 0.
if(!isset($s['last']))
    $s['last'] = 0;


//check if we have a last time set in session before. if not set a default = curret time.
if(!isset($s['time']))
    $s['time'] = time();


//get the idle time of the user.
$idle = time() - $s['time'];

//start the loop..and set starting point.
$start = $s['last'] + ($idle / $sleep);

for( $i = $start; $i < 100; $i++)
    echo $i . '<br />';
    $s['last']++;
    $s['time'] = time();
    flush();
    sleep($sleep);

希望对你有帮助！！

【讨论】：

我认为，其目的不是改变计数器的值，而是即使用户关闭选项卡也要执行任务。 是的，这就是我在回答中提到的。

以上是关于javascript刷新页面后继续运行，不从头执行的主要内容，如果未能解决你的问题，请参考以下文章

离开页面后php继续执行

执行异步功能后如何刷新页面[关闭]

刷新页面后怎么让js定时器继续刷新前的状态继续计时

更新面板刷新后如何运行一些 javascript？

刷新页面并在之后运行函数 - JavaScript

javascript中的setTimeout怎么用？ 我想定时刷新页面！！！