防止浏览器在刷新时自动滚动

如果转到页面a并滚动浏览，则刷新页面将在您离开页面的位置刷新。这很好，但是在URL中存在锚点位置的页面上也会发生这种情况。例如，如果您单击链接http://example.com/post/244#comment5并在环顾四周后刷新页面，您将不会处于锚点，而页面会跳来跳去。有没有办法用JavaScript防止这种情况？因此，无论如何，您始终可以导航到锚点。

由于浏览器行为的更改，不再推荐此解决方案。查看其他答案。

基本上，如果使用锚，则将绑定到Windows滚动事件。这个想法是，第一个滚动事件必须属于浏览器完成的自动重新定位。发生这种情况时，我们将进行自己的重新定位，然后删除绑定事件。这样可以防止随后的页面滚动使系统混乱。

$(document).ready(function() {
    if (window.location.hash) { 
        //bind to scroll function
        $(document).scroll( function() {
            var hash = window.location.hash
            var hashName = hash.substring(1, hash.length);
            var element;

            //if element has this id then scroll to it
            if ($(hash).length != 0) {
                element = $(hash);
            }
            //catch cases of links that use anchor name
            else if ($('a[name="' + hashName + '"]').length != 0)
            {
                //just use the first one in case there are multiples
                element = $('a[name="' + hashName + '"]:first');
            }

            //if we have a target then go to it
            if (element != undefined) {
                window.scrollTo(0, element.position().top);
            }
            //unbind the scroll event
            $(document).unbind("scroll");
        });
    }

});

在Chrome上，即使您将scrollTop强制设为0，它也会在第一个滚动事件之后跳转。

您应该将滚动条绑定到此：

$(window).on('beforeunload', function() {
    $(window).scrollTop(0);
});

因此，浏览器被欺骗了，以为它是在刷新之前的开始。

要禁用自动滚动恢复，只需将此标签添加到头部。

<script>history.scrollRestoration = "manual"</script>

IE不支持。浏览器兼容性。

经过多次失败后，我终于做到了。anzo是正确的，因为beforeunload当用户重新加载页面或单击链接时，使用会使页面跳至顶部。这样unload做的明显方法就是如此。

$(window).on('unload', function() {
   $(window).scrollTop(0);
});

JavaScript方式（感谢ProfNandaa）：

window.onunload = function(){ window.scrollTo(0,0); }

编辑：16/07/2015

即使unload事件发生，Firefox仍然存在跳转问题。

这是一种更通用的方法。我没有试图阻止浏览器滚动（或跳到顶部，看上去），而是恢复了页面上的先前位置。也就是说，我正在localStorage中记录页面的当前y偏移量，并在页面加载后滚动到该位置。

function storePagePosition() {
  var page_y = window.pageYOffset;
  localStorage.setItem("page_y", page_y);
}


window.addEventListener("scroll", storePagePosition);


var currentPageY;

try {
  currentPageY = localStorage.getItem("page_y");

  if (currentPageY === undefined) {
    localStorage.setItem("page_y") = 0;
  }

  window.scrollTo( 0, currentPageY );
} catch (e) {
    // no localStorage available
}

您只需将＃放在末尾，这样页面就会加载到顶部。

因为它是如此简单，所以可在所有浏览器（移动和台式机）上使用。

$(document).ready(function() {
var url = window.location.href;
console.log(url);
if( url.indexOf('#') < 0 ) {
    window.location.replace(url + "#");
} else {
    window.location.replace(url);
}

}）;

//这会加载页面末尾的＃号。

这对我有用。

    //Reset scroll top

    history.scrollRestoration = "manual"

    $(window).on('beforeunload', function(){
          $(window).scrollTop(0);
    });

你应该能够。

加载时，检查是否window.location.hash有值。如果是这样，请获取ID与哈希值匹配的元素。查找元素的位置（对offsetTop / offsetLeft的递归调用），然后将这些值传递到window.scrollTo(x, y)方法中。

这应该将页面滚动到所需的元素。