history.back(-1)没有刷新最后一页？

Question

我正在使用Rails 4创建Pinterest,就像模态叠加一样.它们显示在无限滚动页面的半透明覆盖上.

目前,当您单击该链接时,浏览器的历史记录将更改为反映您正在查看的项目.但是我有一个退出按钮,当按下时,我想让它删除覆盖(它已经做了),但然后更改URL而不会丢失用户在无限滚动上的位置.

pinterest究竟如何在不刷新最后一页的情况下完成更改URL？我会使用带有'/'的pushState,但我有多种类型的无限滚动页面,我希望脚本适用于所有这些页面.

的application.js

if (history && history.pushState){
  $(function(){
   $('body').on('click', 'a', function(e){
      $.getScript(this.href);
      history.pushState(null, '', this.href);
    });
    $(window).bind("popstate", function(){
      $.getScript(location.href);
    });
  });
}

关闭覆盖脚本

function removeDabble() {
    history.back(-1);

    /*var elem = document.getElementById('artview');
    elem.parentNode.removeChild(elem);
    return false;*/
}

Answer 1

最好的解决方案是使用某种路由脚本。像 davis、sammy、crossroads、director、routes.js .... 有很多选择。

\n\n

您可以轻松实现前后推送状态/主题标签样式，而无需刷新页面。这些插件可以帮助您处理不支持推送状态的订单浏览器。

\n\n

如果您不需要照顾旧浏览器。您只需更改 url 即可，无需刷新页面

\n\n

// this go to the new url\nwindow.history.replaceState(\xe2\x80\x9c\xe2\x80\x9d, \xe2\x80\x9cTitle\xe2\x80\x9d, \xe2\x80\x9c/newUrl\xe2\x80\x9d);\n\n// first param is if you want to parse some data around, but its best to just use localstorage/session storage or cookie, and a event listener. \n\n// second parameter is the page title, some browser ignores it\n\n// last param is the url  eg : \n        '/newUrl'   => .com/newUrl,  \n        '/1/2/3'    => .com/1/2/3\n

\n\n

实现history.back，就像你想要的那样。您可以在中创建一个新数组

\n\n

例如：浏览器历史记录 = []

\n\n

每次更改 url 时，将 url 推送到该数组中，我通常将限制设置为 10，并且它会丢弃之前的 URL，但这取决于您。

\n\n

function updateHistory(url) {\n    window.browserHistory = window.browserHistory? window.browserHistory : [];\n    if (window.browserHistory.length > 10) {\n         window.browserHistory = window.browserHistory.shift()\n    }\n    window.browserHistory.push(url)\n}\n

\n\n

与我们自己的history.back版本相比，您只需使用上述方法替换数组中的最后一个url，您可以弹出，或者只是继续追加到数组中。并执行其他操作。

\n