日期：2014-05-16 浏览次数：20799 次
随着ajax的“大爆炸”，跟web带来了活力，但也带来了一下新的问题，比如下面将要讨论的“浏览器前进后退”的问题，由于局部刷新，url不变，浏览器感知不到“变化”，无法使用前进后退按钮。
?
解决问题之前
?????
浏览器是如何记录访问历史并实现前进与后退的？
?
通常我们看到的浏览器地址栏URL的变化会被浏览器记录下来，还有页面中iframe子页面的地址变化也也会被浏览器记录，
?
浏览器将访问记录保存起来，以便进行前进和后退。
?
例如在http://www.google.com.hk后跟上不同的参数(或者不同的锚点)，浏览器将会一一记录下来。
?
开始解决问题
?
知道了浏览器是如何记录访问历史的（URL的变化），那就可以解决ajax带来的不能前进后退的问题了，思路有二：
?
1.通过隐藏的iframe记录浏览历史来实现
?
?? 实现思路：
?
?? 在主页面中嵌入iframe,在每次触发ajax的请求的时候，将ajax请求的地址传递给iframe的子页面，此时浏览器将会
?
?? 记录下iframe子页面地址的变化，当触发浏览器的前进后退按钮时，iframe的子页面地址会变化，此时iframe的子页
?
?? 面中的js将会调用主页面中的相应js方法来调用对应的ajax请求。
?
?
?
2.通过URL中锚点或者参数的变化来实现
?
? gmail、twitter和pip.io均使用这种方式来解决ajax前进后退的问题
?
?
?
?
?
?
有一定经验的开发者都有过对于ajax前进后退历史控制的经历，也涌现了不少的框架，不过发现这些框架对于设置了document.domain的会抱拒绝访问，其原因是因为动态创建的iframe没有设置document.domain，所以不灵了。
但这不是我要说的，我要说的是，当用户直接修改地址栏的hash并敲击回车后，这时候你就会发现历史控制失灵了。
大家要弄清楚，对于页面中有iframe的情况，iframe地址的变化（注意，通过window.location.href = hash;）会被浏览器记录在案，如果每次都是变化的iframe的地址，那前进后退都会改变iframe的地址，而不影响主页面。所以对于手动改动了地址栏的hash，改动的是主页面的hash，但不是href，所以需要同步到iframe中的href去，这样才可以在维系历史控制。
具体代码就不详细列出了，大家注意到这点就行了。
