Question

我正在使用HTML和JavaScript来编写Android APP，但我遇到的问题是，当从当前页面返回到上一页时，页面会重新加载，并且当我在第一页中进行选择和设置时会进入默认状态。

例如：在第一页上，用户可以选择国家和城市，然后导航到第二页。

如果用户点击后退按钮（调用window.history.back();或href="javascript:history.back(-1);"），然后他所做的所有选择都将丢失，并显示默认选择。

在Android的原生浏览器中工作正常。如何保持选择状态？

提前致谢！

Answer 1

您需要创建虚拟历史记录以禁用历史记录返回按钮。

var originalHash = document.hash || "#dummyMain"
location.assign("#dummyBack")
location.assign(originalHash)
window.addEventListener("popstate",function(){
  if(location.hash == "#dummyBack"){
    window.history.pushState(null,null,originalHash)
  }else{
    originalHash = location.hash
  } 
});

上面的代码创建了虚拟页面历史记录，并检查是否通过历史记录返回按钮发生了页面转换，如果是，则强制页面再次移动到当前页面以停止历史记录返回操作。

由于您没有在问题中添加任何代码，因此几乎不可能说它会起作用，但我想一旦您加载此代码，它应该禁用所有页面返回操作。

如果您使用PC / Mac使用此网站，请尝试打开开发工具/ firebug javascript控制台并复制/粘贴代码并按下历史记录返回按钮以查看其工作原理。

Answer 2

我找到了一种维护上一页数据的好方法，在离开此页面之前使用localStorage将数据存储为键值，再次返回此页面时，您可以从localStorage再次获取数据并显示它。

因为AJAX加载的数据将在历史回溯中持续。

希望这有助于某人解决此问题。

如何在后退按钮上保持选择状态

2 个答案: