返回Firefox历史记录后,JavaScript将无法运行

Pat*_*nza 78 javascript firefox

当我使用Firefox上的后退按钮访问以前访问过的页面时,该页面上的脚本将不再运行.

第二次查看页面时是否有任何修复/解决方法让脚本再次执行?

请注意,我在Google Chrome和Internet Explorer上测试了相同的网页,并且它们按预期工作.


以下是我用来测试问题的文件和步骤:

(导航到0.html,点击进入1.html,后退按钮)

0.html

<html><body>
<script>
  window.onload = function() { alert('window.onload alert'); };
  alert('inline alert');
</script>
<a href="1.html">Click Me!</a>
</body></html>
Run Code Online (Sandbox Code Playgroud)

1.HTML

<html><body>
<p>Go BACK!</p>
</body></html>
Run Code Online (Sandbox Code Playgroud)

小智 86

设置要在window.onunload上调用的空函数:

window.onunload = function(){}; 
Run Code Online (Sandbox Code Playgroud)

例如

<html><body>
<script type="text/javascript">
  window.onload = function() { alert('window.onload alert'); };
  window.onunload = function(){};
  alert('inline alert');
</script>
<a href="1.html">Click Me!</a>
</body></html>
Run Code Online (Sandbox Code Playgroud)

来源: http ://www.firefoxanswer.com/firefox/672-firefoxanswer.html (存档版)

  • 你没有覆盖任何东西,这只是阻止Firefox在后向缓存(bfcache)中缓存页面.https://developer.mozilla.org/en/DOM/window.onunload https://developer.mozilla.org/En/Using_Firefox_1.5_caching (7认同)
  • 谢谢,它的确有效.有关默认onunload处理程序的功能的任何提示?(例如,我是否在这里覆盖某种默认行为?) (2认同)

bob*_*nce 73

当我使用Firefox上的后退按钮访问以前访问过的页面时,该页面上的脚本将不再运行.

这是正确的,这是一件好事.

当您点击Firefox(以及Safari和Opera)中的链接时,它不会立即销毁您的页面以进入下一个页面.它使页面保持完整,只是将其隐藏在视图之外.如果您点击后退按钮,它将使旧页面重新进入视图,而无需再次加载文档; 这要快得多,从而为用户提供更平滑的后退/前进页面转换.

此功能称为bfcache.

您在用户之前加载和使用它时添加到页面的任何内容仍将存在.您附加到页面元素的任何事件处理程序仍将附加.您设置的任何超时/间隔仍将处于活动状态.因此,您很少有任何理由需要知道您已被隐藏并重新显示.onload再次调用或内联脚本代码是错误的,因为您在该函数中执行的任何绑定和内容生成将在同一内容上执行第二次,可能会带来灾难性的后果.(例如document.write,在内联脚本中会完全破坏页面.)

写入的原因window.onunload是,实现bfcache的浏览器已决定 - 为了与真正需要知道何时被丢弃的页面兼容 - 任何声明有兴趣知道何时onunload发生的页面都会导致bfcache被禁用 当你回到它时,该页面将被新载,而不是从bfcache中获取.

所以,如果你设置window.onunload= function() {};,你实际做的是故意打破bfcache.这将导致您的页面导航缓慢,除非作为最后的手段,否则不应使用.

如果您确实需要知道用户何时离开或返回到您的页面,而不会弄乱bfcache,则可以捕获onpageshowonpagehide事件:

window.onload=window.onpageshow= function() {
    alert('Hello!');
};
Run Code Online (Sandbox Code Playgroud)

  • 这不是一件好事,因为它不会再次运行javascript,考虑到它已缓存...但实际上并没有缓存javascript之前所做的更改.如果javascript在页面加载时淡入一个元素,它在历史记录中访问时不会再次淡化它...但是再次在0不透明度上启动它,撤消javascript所做的事情!它必须是全部或全部.如果你想在没有再次运行javascript的情况下缓存它,你必须在javascript运行后缓存页面的完整状态! (11认同)
  • 我的问题是bfcache不会缓存所有页面,因此我必须重新运行js才能重建丢失的内容。因此,对整个页面进行修改是可以的。无论如何,我不是在使用window.onload事件,而是在使用jQuery document.ready事件。您知道仍然可以使用document.ready并避免此问题的方法吗? (2认同)

Mik*_*ola 19

您可以查看活动的persisted属性pageshow.初始页面加载时设置为false.从缓存加载页面时,它设置为true.

window.onpageshow = function(event) {
    if (event.persisted) {
        alert("From bfcache");
    }
};
Run Code Online (Sandbox Code Playgroud)

出于某种原因,jQuery在事件中没有此属性.你可以从原始活动中找到它.

$(window).bind("pageshow", function(event) {
    if (event.originalEvent.persisted) {
        alert("From bfcache");
    }
});
Run Code Online (Sandbox Code Playgroud)