更新内容，更改 url 而不加载页面窗口.history.pushState. - updating content,changing url without loading the page window.history.pushState

updating content,changing url without loading the page window.history.pushState

大家好，我打算在我的网站中使用window.history.pushState，但我对如何做到这一点知之甚少。

我

想要的是我有一个页面仪表板.php并且想将 URL 更新到仪表板.php？do=edit&who=me 并使用 ID 加载div 内容div 不加载整个页面....

我知道这可以通过这段代码来完成

 function processAjaxData(response, urlPath){
   document.getElementById("content").innerHTML = response.html;
   document.title = response.pageTitle;
   window.history.pushState({
     "html":response.html,
     "pageTitle":response.pageTitle}, "", urlPath);
 }
  window.onpopstate = function(e){
    if(e.state){
      document.getElementById("content").innerHTML = e.state.html;
      document.title = e.state.pageTitle;
    }
};

但是我不知道如何实现这个响应函数的内容。

我也希望如果浏览器不支持此功能，那么在这种情况下，这应该像链接一样，刷新页面可能没问题

任何想法/帮助不胜感激

使用一些JavaScript路由库，例如可以在GitHub上找到的Routie-http://projects.jga.me/routie/

使用路由和jQuery的路由示例如下：

routie({
    'dashboard/edit/:who': function (who) {
       $.ajax({
           url: 'api.php',
           data: {prop: 'propVal'},
           method: 'POST'
       })
       .done(function (res) {
          console.log(res);
       });
    }
);

要运行上面的函数，请输入YOURSITE.COM#dashboard/edit/me而不是YOURSITE.COM/dashboard.php?=...。