web-dev-qa-db-ja.com

HTMLでのページの更新時にページのスクロール位置を強制的にトップにします

divsを使用して公開しているWebサイトを構築しています。ページを位置Xにスクロールした後にページを更新すると、ページはスクロール位置Xでロードされます。

ページの更新時にページを強制的に一番上にスクロールするにはどうすればよいですか？

  • 私が考えることができるのは、ページのonLoad()関数として実行されるJSまたはjQueryのSETがページを上にスクロールすることです。しかし、どうすればそれができるのかわかりません。

  • より良いオプションは、page loadのような種類であるデフォルト（つまり上部）としてスクロール位置でページをロードするプロパティまたは何かがある場合です。 page refreshの代わりに。

javascriptjqueryhtmlpageloadpage-refresh
103
Moon

DOM ready で scrollTop メソッドを使用して実行できます：

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

単純なplain JavaScript実装の場合：

window.onbeforeunload = function () {
  window.scrollTo(0, 0);
}
131
ProfNandaa

また試すことができます

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

X位置でスクロールする場合は、0の値をxに変更できます。

9
Ankitkumar Bhatt

JQueryの.scrollTop()関数を確認してください here

それは次のようになります

$(document).load().scrollTop(0);
8
jon3laze

繰り返しますが、最良の答えは次のとおりです。

window.onbeforeunload = function () { window.scrollTo(0,0);

（jQuery以外の場合は、JQメソッドを検索している場合に検索します）

編集：「onbeforunload」という少しの間違い:) Chromeおよび他のブラウザは、アンロード前に最後のスクロール位置を「記憶」しているため、ページをアンロードする前に値を0,0に設定すると0,0を思い出して、スクロールバーがあった場所にスクロールバックしません:)

8
xoxel

location.reload()の代わりに、単にlocation.href = location.hrefを使用します。 location.reload()のように前の位置にスクロールしません。

注：URLに＃がある場合、これはリロードしません

6
Nauphal

ここに答え（$(document).readyでスクロール）は、ページにビデオがある場合は機能しません。その場合、このイベントが発生した後にページがスクロールされ、作業がオーバーライドされます。

最良の答えは次のとおりです。

$(window).on('beforeunload', function(){
    $(window).scrollTop(0);
});
4
DrPollit0
<script> location.hash = (location.hash) ? location.hash : " "; </script>

上記のスクリプトをHTMLの<head>タグに入れます。シングルページアプリの動作がわからない！ただし、通常のページでは確かに機能します。

3
harshes53
$(document).ready(function(){
    $(window).scrollTop(0);
});

google chromeはページの読み込みが完了した後、下にスクロールするだけなので、私にとってはうまくいきませんでした。私が使ったのは

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

//これにより、ページの最後に＃がロードされます。そのため、常に上部にロードされます。

3
Daut

Supercalifragilisticexpialidocious答えは次のとおりです。

これをjsファイルまたはscript tagの先頭に追加します

document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera

document.body.scrollTop = 0; // For Safari
0
Nicobels