处理浏览器中的后退按钮事件

Question

在我的网络应用程序中，我有一组项目（基因名称），用户可以使用箭头键浏览这些项目。发生这种情况时，我更改浏览器 URL 以反映新选择：

window.history.pushState(null, null, "/" + root_subdir + "/?gene=" + gene_name);

我这样做是为了让用户可以复制更改后的 URL，然后输入 URL 以使用该基因的数据集加载我的网络应用程序。此设置似乎在当前浏览器中可以正常工作。

我的问题是当人们使用箭头键浏览数组中的基因，然后单击浏览器的后退按钮时，我如何处理这种情况。

这会将浏览器地址栏中的 URL 更改为历史记录中先前 URL 中的内容，但此 URL 更改不会使用该数据加载浏览器。

当用户点击后退按钮时，是否有我可以监听的事件，比如说，这会让我触发一个事件来触发加载前一个基因的数据集？

Answer 1

你快到了。您已经 pushState。您现在需要的是将处理程序附加到 popstate event。将该处理程序挂接到加载数据的同一函数。