Question

我多次使用jQuery Address来支持小型异步应用程序中的后退按钮。

当所有AJAX请求执行相同的操作（即，异步请求页面并用请求替换HTML元素）时，实现可以很容易。

当AJAX请求可能做不同的事情时，让我们说在一个案例中打开一个叠加层并在另一个案例中更改整个页面的内容，事情会变得混乱。

我最后得到了一些非常糟糕的代码，因为我必须通过大量的if语句来分析哈希值（＃/ somepage / someotherpage）。

我总是对自己重复：必须有更好的方法来做到这一点。

有没有人遇到同样的问题，可以提出解决方案吗？

如果没有，请查看我的想法并告诉我你的想法。

我的想法是创建一个模拟window.history对象的对象，但仅限于AJAX历史，我们称之为“ajaxhistory”。每次异步请求页面时都会发生这样的事情：

ajaxhistory[i] = {
    url: 'here the url',
    type: 'overlay'
    otherusefulinfo: 'whatever'
}
i++

所以，例如：

if(moving back or forward){
    if(currenturl == ajaxhistory[i-1].url){
        // i'm going back
        // i'm able to know what type of action i should take thanks to
        // ajaxhistory[i-1].type and ajaxhistory[i-1].otherusefulinfo
    }
 }

我喜欢这个想法，因为它会使我的代码更容易阅读，保留和改变。假设我想添加新功能...我可以添加一个新类型，我可以使用它，而通常我应该编辑很多糟糕的if语句。

你怎么看？从绩效角度来看是否会出现问题？

Answer 1

查看Ben Alman的这项工作

http://benalman.com/projects/jquery-bbq-plugin/

他有一个插件来帮助支持后退按钮。

希望这很有用。

鲍勃

Answer 2

您可以使用html5功能：
window.history.pushState({type: 'overlay'}, title, url)，其中第一个参数是JS对象。

您可以像这样访问此对象：


window.onpopstate = function(event) {
  alert( event.state.overlay);
}

有关详情，请查看https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history

支持AJAX历史按钮而不会发疯

2 个答案: