Question

所以，让我们说我有一个网络应用程序

localhost:8080/myapp?home

如果我将当前状态主页更改为 state1 ，我想将（上一个）状态主页保存在本地存储中，就像那样< / p>

$.totalStorage("prevState", window.location.search.substr(1));

但这条线应该在哪里执行？

我也在使用 history.js 库。但是我只能在状态改变后获得URL状态。

History.Adapter.bind(window, "statechange", function() {
    var page = window.location.search.substr(1); //page === "home"
});

我也在使用这个功能

goTo : function(page) {
    var page = window.location.search.substr(1); //page === "state1", but not with back, forward, backspace buttons
    History.pushState({page: page}, getPageTitle(page), "?" + page);
}

但是当我通过此函数调用更改URL状态时，这只会保存以前的状态。如何通过按下浏览器后退和前进按钮以及退格键或鼠标后退和前进按钮来全局执行此操作。

Answer 1

为什么不创建历史堆栈并将当前状态添加到其中？这让你有机会回到一个州而不仅仅是一个州。例如：

$(window).on("statechange", function() {
    var historyStack = localStorage.getItem("stateHistory") === null ? [] : JSON.parse(localStorage.getItem("stateHistory"));
    historyStack.push(window.location.search.substr(1));
    localStorage.setItem("stateHistory", JSON.stringify(historyStack));
});

要导航回来，您将获取历史堆栈中的倒数第二个条目，然后在更改状态之前从历史堆栈中删除最后两个（！）条目。

Answer 2

我不确定这是否是正确的答案，但我想我会尝试将功能附加到＆＃34; beforeunload＆＃34; event，然后使用window.location获取URL。一旦你有了，将它存储在localStorage必须很容易。

window.onbeforeunload=function(e){
    window.location.href.toString().split(window.location.host)[1]
}

我不知道您的确切用例。

如何在statechange上获取当前（上一个）URL状态

2 个答案: