刷新后“后退”按钮不按预期工作

提问者：小点点

刷新后“后退”按钮不按预期工作

我再次问这个问题是因为这个问题已经不在我的问题列表中了，而且我有一个有效的答案。在这个问题消失之前，有100多人观看了这个问题，没有任何评论或答案。

我在Windows，Apache/mod_perl，dHTML（HTML，CSS，JavaScript，Perl）环境中工作。我正在开发一个应用程序，应该可以在Chrome，Edge，FF，IE和Opera浏览器上运行。下面我所描述的问题在FF和IE中都能正常工作。它在Chrome，Edge或Opera中都不能像预期的那样工作。

我已经建立了一个网页多达6个iframes显示最近5年的肯塔基州县的彩色地图的测量。每个iframe都有许多链接。如果我采取3个链接，例如，在一个或任意组合的iframes，并输入刷新，网页返回到其初始状态。此时，如果我返回，我将期望离开该页面。

但这种情况不会发生。要离开页面，我必须输入回n+1次，其中n是我采取的链接数量。并且每个Back条目只会导致复合web页面闪烁，直到我离开该页面。

下面的链接将向您展示这个问题。它正在我肯塔基州家中的服务器上执行。输入任意3个链接，刷新，并尝试退出。

http://steepusa.no-ip.info/scx/gencm1m.cgi？str=0~Sky~HealthyBirths！V~L

刷新过程中的任何内容都不在我的程序控制之下。用户刚刚进入浏览器刷新按钮。这就像复合网页的历史记录已经被擦除，但是历史记录条目的计数没有被归零。它不会在链接的历史记录中后退一步。

这不可能是正确的。这对我来说毫无意义。这是我在完成这个应用程序时唯一一个悬而未决的跨浏览器问题。若要查看网页的工作方式，请尝试FF或IE中的链接。任何帮助都将不胜感激。

克雷格特

共1个答案

匿名用户

首先，在给出我的答案之前，我认为这个问题应该用浏览器代码来回答。在我的应用程序中的所有演示页面中，当我刷新然后进入后退按钮时，我就离开了该页面。我认为这个多iframe页面应该以同样的方式工作。 Github上有一个线程(#2944)，涉及主要浏览器的代表，于2017年开通，大约十几天前更新，内容是关于公开History.index。他们意识到带有多个iframes的页面的路由困难，并且正在寻找一些方法来帮助开发人员。

html是如下所示的4个链接。

{

 <A ID='delnkSetID1' CLASS='lnk3' STYLE='POSITION:absolute;TOP:260px;LEFT:133px;'           
 TITLE='Back In History' ONMOUSEOVER=\"setStatus(' ');\" ONMOUSEOUT=\"setStatus(' 
 ');\" ONCLICK='doHstry2(\"B\");'>Back</A>

 <A ID='delnkSetID2' CLASS='lnk3' STYLE='POSITION:absolute;TOP:260px;LEFT:193px;' 
 TITLE='Forward In History' ONMOUSEOVER=\"setStatus(' ');\" ONMOUSEOUT=\"setStatus(' 
 ');\" ONCLICK='doHstry2(\"F\");'>Forward</A>

 <A ID='delnkSetID3' CLASS='lnk3' STYLE='POSITION:absolute;TOP:260px;LEFT:273px;' 
 TITLE='Refresh To The Initial State' ONMOUSEOVER=\"setStatus(' ');\" 
 ONMOUSEOUT=\"setStatus(' ');\" ONCLICK='doRfrsh();'>Refresh</A>

 <A ID='delnkSetID4' CLASS='lnk3' STYLE='POSITION:absolute;TOP:260px;LEFT:348px;' 
 TITLE='Leaave The Page' ONMOUSEOVER=\"setStatus(' ');\" ONMOUSEOUT=\"setStatus(' 
 ');\" ONCLICK='doHstry2(\"L\");'>Leave</A>

}

接下来是JavaScript。

}

 var cntIndx, lstHstLen, stpsInStrt; // Globals for the emulation of a history index.
 if (cntIndx === undefined) {
   cntIndx = 0; // 'Current' position in the history object.
   lstHstLen = history.length; // 'Last' history length.
   stpsInStrt = history.length; // Initial history length depending on call origin.
 }

 function doHstry2(op) { 

   if (history.length != lstHstLen) { // History length has increased since last time.
     cntIndx = 0; // Reset the top (equal to 0) of history index.
   }
           
   var histCntNow = history.length; // Quantity same in all iframes and the parent.

   switch(op) { // Do the operation requested.
     case 'L': // Leave the page.
       var nBck = histCntNow - stpsInStrt + cntIndx + 1;
       history.go(-nBck);
       break;
     case 'B': // Back 1 in history.
       cntIndx--;   
       history.go(-1);
       break;
     case 'F': // Leave the page. 
       if (cntIndx + 1 <= 0) { // The zero position is the top of the history stack.
         cntIndx++;   
         history.go(+1);
       }    
   } 
         
   lstHstLen = history.length; // Capture the 'current' history length.             

 } 

 function doRfrsh() {
   this.location.href = \"gencm1m.cgi?str=$params\"; // $params is Perl variable.
 }

}

该方法最初将全局历史对象位置指示符设置为0，最后一个历史条目，以及全局“最后一个”历史长度和初始条目处的历史长度。

在函数输入之后，我首先检查历史记录是否增加（更改）。如果它有，我重置位置指示器到‘顶部’的历史。

接下来，我现在捕获历史长度。

然后我通过操作处理一个开关。前进和后退块增加（如果不在顶部）和减少位置索引，并且都采取适当的前进或后退步骤。刷新将条目URL分配给this.location.href。离开块计算要跳过以离开的条目数。计算从当前历史长度减去初始条目历史长度加上历史顶部的cntIndx值+1。

最后，当我离开时，我将历史长度设置为上一个历史长度。

我已经用3个模块/页面进行了测试，这些模块/页面带有多个iframes，在我正在使用的应用程序中，它们被从11个不同的地方以不同的方式调用。每种不同的方式都有不同的起始历史长度。我在调用/使用每个模块的每种方式上运行了6个测试。最后2个涉及到在每个复合页面上相当多的随机移动。它在所有情况下都按预期工作。

如有任何意见将不胜感激。谢谢大家的帮忙。您可以在上面的链接中看到解决方案的工作。