javascript - 如何在加载、后退和前进时运行函数

Question

我查看了该网站上的其他一些过时的问题，发现他们的解决方案似乎不再适用于现代浏览器。

var foo = function() {
  console.log('woohoo');
};
foo();

我希望它每次都能运行。显然，我在第一次初始加载时运行它没有问题，但我使用 url 哈希来隐藏和显示某些内容的 div。当用户单击前进和后退时，我也希望此功能再次运行。

Answer 1

浏览器缓存页面，以便在后退/前进时加载速度更快。因此，加载事件永远不会被触发，这也是您的代码不再运行的原因。浏览器只是恢复之前的状态。

参见this answer了解更多详细信息。

由于您只是处理哈希值，因此您可以尝试绑定(bind)到 onhashchange事件并调用您的方法。

window.addEventListener("hashchange", foo);

如果您使用的是单页面框架，例如 Angular、Backbone 或其他许多框架之一，它们通常也会为您提供一种处理此问题的方法，因此如果是这种情况，请检查文档。