1

我正在一个显示交易记录列表(每页 10 条记录)的网站上工作。

该页面具有分页搜索功能,允许用户查看特定的交易记录。(如日期范围,类型....最多10多个参数)

当用户单击任何内容(更改页面/搜索条件)时,将使用 ajax 调用来获取和显示事务而无需重新加载。

但是,假设用户单击下一页(ajax 调用)以查看 page2 并尝试单击浏览器后退按钮。该站点会将他重定向到另一个网页,而不是返回到 page1。

我知道window.history.pushState在 chrome/Firefox 中无需重新加载 html5 即可更改 url。但我必须支持像 IE7+/FF/Chrome/Safari 这样的旧浏览器。

有没有现有的解决方案来解决这个问题?谢谢。


编辑:我在这个中午尝试了 history.js。

// newUrl: "?para1=value1¶2=value2&....

history.pushState({data:"searchTransaction"}, document.title, newUrl);

并且在 ajax 请求之后 url 发生了变化。我有一个问题是如何处理更改事件。我想绑定 back/next(user click) 事件并获取“newUrl”,然后将其解析回参数映射并再次执行 ajax 请求。如果可能的话,我想在 pushState 时存储整个参数数组。

4

1 回答 1

1

不幸的是,您无法捕捉到“后退/下一个”事件,因为它不存在,但您可以捕捉到statechange

// Bind to StateChange Event
History.Adapter.bind(window,'statechange',function(){ // Note: We are using statechange instead of popstate
    var State = History.getState(); // Note: We are using History.getState() instead of event.state
    History.log(State.data, State.title, State.url);
});

我通常做的是捕捉用户的点击,如果没有点击就触发了状态更改,我假设用户下一步或返回。

于 2013-01-21T10:27:35.830 回答