Question

请考虑以下内联代码：

<h1 id="top">Top Of Page</h1>
...
<a class='reload' onClick='window.location.reload();'>Reload</a>

如何以一种这样的方式来实现这一点：当窗口重新加载时，它会到达锚点页面的顶部？我只是尝试做：

reload to top of page

$(window).on('load', function(){
  $('html, body').scrollTop(0);
});

和：

Reload browser does not reset page to top

$(document).ready(function(){
    $(this).scrollTop(0);
});

直接在相关模板中，但不会加载到顶部吗？除了不包括jQuery，为什么会这样？

有没有一种方法可以内联以保持一致？这样的东西（我尝试过）：

<a class='reload' onClick='window.location.reload().scrollTop(0);'>Reload</a>

也不会转到页面顶部。

然后我想到了我可以锚定的ID的href：

anchor jumping by using javascript（根据我的情况稍作调整）

<script type="text/javascript">
function goToTop(){
    var url = location.href;               
    location.href = url + "#top";             
}
</script>

<a class='reload' onClick='goToTop()'>Reload</a>

在这种方法中，它仅将“ #top”添加到URL，而没有其他任何内容。

给我的印象是，如果您更改location.href it redirects to the new URL. It says here“ href属性设置或返回当前页面的整个URL”，该怎么办？为什么不在上面的函数中设置它？

这似乎很简单，所以我不明白自己缺少什么？

Answer 1

您只需在将window.location.reload(true)设置为锚点的行之后添加[window.]location.href。

Answer 2

通过@epascarello发布答案，该答案嵌入到上面的评论中，因为它对我有用，是我见过的最简单的答案。

如果您不需要/不需要任何动画重装动作，只需使用两个不同的事件-首先将当前页面/滚动位置移动到顶部[window.scrollTo（0,0）;]，然后重新加载页面，可以从缓存[window.location.reload（）;]中获取，也可以从服务器获取，如果您已更新任何所需的数据[window.location.reload（true）;]。所以，

// Moving page to top on forced reload in javascript
window.scrollTo(0,0); 
window.location.reload();    //or window.location.reload(true) to use new/updated data from the server

希望这对其他人有帮助。再次感谢@epascarello！

window.reload（）-重新加载到锚点页面的顶部

2 个答案: