我遇到以下情况的问题 .
-
用户访问网站
-
用户单击使用history.pushState更新URL的链接
-
通过ajax加载的部分页面内容(使用jQuery)
-
用户单击加载新页面的常规链接
-
用户单击返回以返回到pushState条目
-
页面现在仅显示通过ajax检索的页面部分
我已经使用pushState为各种事情增加了一个网站,结果是一个令人震惊的响应式网络应用程序,但这个问题阻止我使用它 .
以下是代码示例:
$('a').live('click', function(){
history.pushState({}, '', this.href);
popstate(this.href);
return false;
});
popstate = function(url){
$('#content').load(url);
}
window.onpopstate = function(event){
popstate(window.location.href);
event.preventDefault();
}
笔记:
-
在window.onpopstate函数中发出警报时,似乎在步骤5中未触发该事件 . 这是一个错误吗?
-
仅在使用ajax时才会出现此问题 .
-
我不得不分开popstate函数,所以我可以在pushState之后调用它 . 有没有办法手动触发window.onpopstate事件?
1 回答
似乎有些浏览器经常混淆部分加载的ajax和整个页面,用它的布局装饰 . 那是因为他们都有相同的URL . 因此,当用户单击后退按钮时,浏览器将不会加载URL,只会显示之前通过ajax下载的部分内容 .
为了避免这种情况并维护两个单独的内部缓存(一个用于部分页面,一个用于整个页面),您应该在通过ajax调用时在URL中添加GET参数 . 在你的代码中这样:
希望这可以帮助 .