Warning: file_get_contents(/data/phpspider/zhask/data//catemap/4/oop/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 使用ajax调用时如何实现下一步/返回功能?_Javascript_Jquery_Html - Fatal编程技术网

Javascript 使用ajax调用时如何实现下一步/返回功能?

Javascript 使用ajax调用时如何实现下一步/返回功能?,javascript,jquery,html,Javascript,Jquery,Html,我在一个网站上工作,该网站显示交易记录列表(每页10条记录) 页面具有分页和搜索功能,允许用户查看具体的交易记录。(如日期范围、类型……最多10个参数) 当用户单击任何内容(更改页面/搜索条件)时,ajax调用用于获取和显示事务,而无需重新加载 但是,比方说,用户单击下一页(ajax调用)以查看第2页,并尝试单击浏览器后退按钮。该网站将把他重定向到另一个网页,而不是返回到第1页 我知道在chrome/Firefox上有一个窗口.history.pushState可以在不重新加载html5的情况下

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

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

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

但是,比方说,用户单击下一页(ajax调用)以查看第2页,并尝试单击浏览器后退按钮。该网站将把他重定向到另一个网页,而不是返回到第1页

我知道在chrome/Firefox上有一个
窗口.history.pushState
可以在不重新加载html5的情况下更改url。但是我有来支持像IE7+/FF/Chrome/Safari这样的老浏览器

有没有解决这个问题的办法?谢谢


编辑: 今天中午我已经试过history.js了

//新URL:“?para1=value1¶2=value2&…”

history.pushState({data:"searchTransaction"}, document.title, newUrl);
在ajax请求之后,url发生了变化。我有一个问题是如何处理变化事件。我想绑定back/next(用户单击)事件并获取“newUrl”,然后将其解析回参数映射并再次执行ajax请求。
如果可能的话,我想在pushState时存储整个参数数组。

不幸的是,您无法捕获“back/next”事件,因为它不存在,但您可以捕获statechange


我通常做的是捕捉用户的点击,如果在没有点击的情况下触发状态更改,我希望用户执行下一步或后退。

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


我通常做的是捕捉用户的点击,如果在没有点击的情况下触发状态更改,我希望用户下一步或返回。

Try
https://github.com/balupton/History.js/
?@kayen-比我强:)我已经在许多项目中成功地使用了这个方法。试试
https://github.com/balupton/History.js/
?@kayen-Beat我对它说:)我已经在许多项目中成功地使用了它。
// 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);
});