带有后退和前进按钮的history.pushState

我需要使用这个ajax方法制作后退和前进按钮
此代码运行良好，浏览器上的URL应该更改
但是当你点击后退和前进按钮时，什么也没发生

(function(){ function clickNav(e){ e.preventDefault(); var href = $(this).attr('href'); history.pushState(null, null, href); $.ajax({ url: href, dataType: 'html', cache: false }).done(function(html){ var $html = $(html); $('title').html($html.filter('title').text()); $('#content').replaceWith($html.find('#content')); $('#nav').replaceWith($html.find('#nav')); $('#nav li a').on('click',clickNav); }); } $('#nav li a').on('click',clickNav); })(); 

Answer 1

我今天不得不处理这件事。 以下适用于我（迄今为止在Win 7中的四个浏览器上测试过）…

 //CHECK FOR ADDRESS BAR CHANGE EVERY 500ms var wwcint = window.setInterval(function(){ if(window.last_location_href == undefined) { window.last_location_href = document.location.href; } else if(window.last_location_href != document.location.href) { window.last_location_href = document.location.href; //DO WHATEVER YOU NEED TO DO TO LOAD THE CORRECT CONTENT someFunctionToLoadTheContent(document.location.href); } }, 500); 

Answer 2

这是因为你的历史是空的。 为此您需要使用

  history.pushState(); 

之后，我的按钮开始工作