ajax返回后转发,javascript – history.pushstate无法浏览器返回和转发按钮

我正在使用jQuery来动态地加载div容器中的内容.

服务器端代码检测请求是AJAX还是GET.

我想让浏览器的后退/前进按钮使用代码,所以我尝试使用history.pushState.我必须遵循一些代码：

$('.ajax').on('click',function(e) {

e.preventDefault();

$this = $(this);

$('#ajaxContent').fadeOut(function() {

$('.pageLoad').show();

$('#ajaxContent').html('');

$('#ajaxContent').load($this.attr('href'),function() {

window.history.pushState(null,"",$this.attr('href'));

$('.pageLoad').hide();

$('#ajaxContent').fadeIn();

});

});

});

一切正常,除非浏览浏览器后退/转发按钮,否则栏中的地址会根据计划而改变,但页面不会更改.我究竟做错了什么？

在Clayton的答案帮助下更新了脚本

var fnLoadPage = function(url) {

$('#ajaxContent').fadeOut(function() {

$('.pageLoad').show();

$('#ajaxContent').html('').load(url,function() {

$('.pageLoad').hide();

$('#ajaxContent').fadeIn();

});

});

};

window.onpopstate = function(e) {

fnLoadPage.call(undefined,document.location.href);

};

$(document).on('click','.ajax',function(e) {

$this = $(this);

e.preventDefault();

window.history.pushState({state: new Date().getTime()},'',$this.attr('href'));

fnLoadPage.call(undefined,$this.attr('href'));

});