Question

我正在一个显示交易记录列表的网站上（每页10条记录）。

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

当用户点击任何内容（更改页面/搜索条件）时，ajax调用用于获取并显示事务而无需重新加载。

但是，例如，用户单击下一页（ajax调用）以查看page2并尝试单击浏览器后退按钮。该网站会将他重定向到另一个网页，而不是返回第1页。

我知道有一个window.history.pushState更改网址而无需在chrome / Firefox的html5中重新加载。但我有支持旧浏览器，如IE7 + / FF / Chrome / Safari。

有没有解决这个问题的现有解决方案？感谢。

修改：我今天中午尝试过history.js。

// newUrl：“？para1 = value1＆amp; para2 = value2＆amp; ....

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

在ajax请求后，url已更改。我有一个问题是如何处理更改事件。我想绑定back / next（用户单击）事件并获取“newUrl”，然后将其解析回参数映射并再次执行ajax请求。如果可能的话，我想在pushState时存储整个参数数组。

Answer 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);
});

我通常做的是抓住用户的点击次数，如果状态变化没有点击，我会说明用户下次或后退。

使用ajax调用时如何实现next / back函数？

1 个答案: