Chrome在浏览器后退按钮上再次执行所有JS

我正在开发一个Web应用程序。 我写了一些JS脚本，可以在文档就绪时执行。 但是在chrome中，当我们点击后退按钮并返回上一页时，它再次执行所有js脚本。 但是当我在firefox上使用它时，它不会执行JS。

我在一个页面上有一个手风琴，当用户打开任何手风琴并进入手风琴下的其中一个链接时，如果再次点击手风琴页面上的后退按钮，chrome就会关闭所有的手风琴，因为我已经编写了脚本来关闭所有这些都准备好了。 但是firefox并没有关闭。

有没有办法用javascript解决这个问题？ 所以我可以放任何条件，如if(history.forward.length < 1){ do this....}

Answer 1

您可以使用pageshow事件来保证始终检测到特定页面的导航，无论用户是按下后退/前进按钮还是选择链接，无论使用哪个浏览器。

然后，您可以执行有关UI状态的检查并根据需要执行逻辑（即修改UI，防止执行其他JS）。

window.addEventListener('pageshow', function(event) { // check state of UI, etc. });

Answer 2

我想到的解决方案是使用sessionStorage来了解它是否是第一次加载。 或者甚至更好，您可以将您的手风琴状态保持在会话存储中，这样它始终是用户想要的方式。

Answer 3

在我的例子中，iframe是一个隐藏的iframe（宽度和高度为零）。

这个iframe只是12年前开发的遗留系统的一种解决方法。 但现在仍在使用当前的应用程序。

为了解决这个问题，我只是将加载到iframe的页面重定向到空白页面。

例：

page_loaded_into_iframe.php

按下“后退按钮”后，浏览器将重新加载空白页面。

请注意，如果您的案例与我的案件不相似，则可能不适用。

Answer 4

在Chrome扩展程序中，您可以使用以下function：

 chrome.webNavigation.onCommitted.addListener（函数回调）

在回调函数中，您可以查看参数：

transitionType + transitionQualifiers

寻找：

“forward_back”用户使用“前进”或“后退”按钮启动导航。

对于deatils，请参阅chrome.webNavigation

当然，可以使用通常的消息模型将此事件传递给内容脚本（请参阅： 消息传递