当用户按下后退按钮时，使用History object/javascript将用户重定向到特定的锚

Question

我目前遇到一个问题，用户正在浏览一个页面，其中包含一长串带有简短详细信息的项目，全部列在一个表中。如果用户想要查看有关该商品的更多信息，他们可以单击链接，在单独的页面上查看特定的详细信息。每个标记都有一个唯一的id属性。我遇到的问题是，当列表很长(也许> 100项)时，如果用户想看一看某个项目，然后想点击后退按钮，它会把他们带到上一页的顶部，失去他们在列表中的位置。

我知道从用户的角度有很多解决方案，比如中键点击/在新选项卡中打开，从网站设计的角度来看(允许在表格中出现更少的结果，这样他们就不会遇到当他们点击后退按钮时很难找到他们所在位置的问题)，等等。

我试图寻找使用历史对象和javascript，并认为我已经看到的地方，我可以取代最后的历史条目，但我所能找到的是如何取代当前的历史条目。最终，我要做的是替换后退按钮通常会带我到相同的url，并将元素的锚添加到末尾。

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

我是否误解了历史对象的工作方式?我希望能够在不使用图书馆的情况下完成这一点。似乎我已经非常接近一个解决方案好几次，但它总是只有一点点。任何帮助将非常感激!

Answer 1

我只是使用cookie。我将最后单击的项目的id保存在cookie中，然后在加载时从cookie中获取id，使用它来查询该元素的dom，然后将焦点设置为该元素。我也使用JQuery在我的个人项目，所以我转换成直接的JS这个答案，因为这个问题被标记为javascript，我希望我的转换是正确的。

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.
}