Question

大家好我打算在我的网站上使用window.history.pushState，但我不知道该怎么做..

我想要的是我有一个页面 dashboard.php ，并希望将网址更新为 dashboard.php？do = edit＆amp; who = me 并加载ID contentdiv 的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;
    }
};

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

并且我也想要如果浏览器不支持这个，那么在这种情况下这应该像链接一样刷新页面可能没问题

任何想法/帮助表示赞赏

Answer 1

使用一些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?=...。

更新内容，更改网址而不加载页面window.history.pushState

1 个答案: