更改后退按钮导致的位置

Question

我正在开发一个Web应用程序，并希望使浏览器中的后退按钮更像是一个应用程序。

用户通过以下步骤发布消息：列出所有消息->阅读一条消息->写答复->答复后返回消息

如果用户然后单击“后退”按钮，则他将在写回复时返回到该页面。 首选的操作是返回所有消息的列表。

我曾尝试使用HTML5历史记录API删除发布后的“写回复”和“阅读一条消息”的历史记录，但似乎无法做到这一点。

还有其他方法可以使其表现出我想要的效果，还是应该保持原样？ 我知道您不应该将后退按钮弄乱，但是我真的认为这会使它更合逻辑。

Answer 1

您可以尝试通过以下方式进行操作：

用户写完回复后，您可以执行此js

// 1) push a fake state in the history
  history.pushState({ foo: "test" }, "test", "test.html");

// 2) add a listener when the user press the back button
  window.addEventListener('popstate', function(event) {
      //redirect user where you want
      window.location.href = '...';
  }, false);

• 请记住，代码@ point1会更改地址栏中的URL，因此，如果您在查询字符串中使用包含某些片段或其他信息的URL，则必须对其进行处理。
• 对于代码@ point2，如果您在单页Web应用程序中，则完成此操作后必须删除侦听器。

但是，这是一个可能的解决方案，但不知道环境，我不知道是否能满足您的要求。 希望这会有所帮助！