当用户按下“后退”按钮时，使用“历史记录”对象/ JavaScript将用户重定向到特定锚点吗？

Question

我目前遇到一个问题，用户正在浏览一个页面，其中包含一长串的项目，这些项目的详细信息全部列在表中。 如果用户希望查看有关该项目的更多信息，则可以单击该链接以在单独的页面上查看特定的详细信息。 每个标签都有唯一的id属性。 我遇到的问题是，如果列表很长（可能> 100个项目），并且用户想要查看一个项目然后单击“后退”按钮，它将带到上一页的顶部，在列表中失去位置。

我知道，从用户的角度来看，有很多解决方案，例如从网站设计的角度出发，在新选项卡中单击/打开，（在表中允许较少的结果，这样就不会遇到如此困难的问题以找到他们单击后退按钮时所在的位置），等等。

我尝试研究使用History对象和javascript，并以为我已经看到可以替换LAST历史记录条目的地方，但是我所能找到的就是如何替换CURRENT历史记录条目。 最终，我要执行的操作是使用相同的URL替换后退按钮通常将我带到的位置，并将元素的锚点附加到末尾。

即，如果用户在www.website.com/listAllItems上，然后单击某个项目的链接以转到www.website.com/viewItem?itemId=1234，我想将最后一个历史记录条目更改为www.website。 com / listAllItems＃1234或类似名称。

我是否误解了History对象的工作方式？ 我希望能够在不使用库的情况下完成此任务。 似乎我已经很接近解决方案好几次了，但始终只有一点点距离。 任何帮助将不胜感激！

Answer 1

我只是使用一个cookie。 我将最后单击的项目的ID保存在cookie中，然后在加载时从cookie中获取ID，使用该ID查询dom的元素，然后将焦点设置为它。 我也在我的个人项目中使用了JQuery，因此由于该问题被标记为javascript，因此我将此答案转换为纯JS，希望我的转换没问题。

function setCookie(cname, cvalue) {
    var d = new Date();
    d.setTime(d.getTime() + (1 * 24 * 60 * 60 * 1000));
    var expires = "expires=" + d.toGMTString();
    document.cookie = cname + "=" + cvalue + "; " + expires;
}

function getCookie(cname) {
    var name = cname + "=";
    var ca = document.cookie.split(';');
    for (var i = 0; i < ca.length; i++) {
        var c = $.trim(ca[i]);
        if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
    }
    return "";
}

element.attachEvent('onclick', function() {
   setCookie(document.URL + '-lastclick', element.getAttribute('id'))
});

window.onload = function() {
  var elementId = getCookie(document.URL + '-lastclick');
  document.getElementById(elementId).focus();

  // personally i do a .animate({ scrollTop: pos}) to scroll to my object, but you get the gyst.
}