HTML'de sayfa yenilendiğinde sayfa kaydırma konumunu en üste zorla

divS ile yayınladığım bir web sitesi kuruyorum . X konumuna kaydırıldıktan sonra sayfayı yenilediğimde, sayfa kaydırma konumu X olarak yüklenir.

Sayfa yenilemede sayfanın en üste kaydırılmasını nasıl zorlayabilirim?

• Ne Aklıma gibi bazı JS veya jQuery çalışmasının olduğu onLoad()için sayfanın fonksiyonu SET sayfaları üstüne gidin. Ama bunu nasıl yapabilirim bilmiyorum.

• Sayfanın varsayılan olarak (yani en üstte) kaydırma konumu ile yüklenmesi için bir özellik veya başka bir şey olması daha iyi bir seçenek olabilir; bu, sayfa yenileme yerine bir tür sayfa yüklemesi gibidir .

Bunu DOM hazırda scrollTop yöntemini kullanarak yapabilirsiniz :

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

Basit ve sade bir JavaScript uygulaması için:

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

Buradaki cevap safari için işe yaramıyor, belge. Zaten genellikle çok erken ateşleniyor.

Bir şeyler yapmanı beforeunloadengelleyen olayı kullanmalısınsetTimeout

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

Yine, en iyi cevap şudur:

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

(jQuery olmayanlar için, JQ yöntemini arıyorsanız bakın)

DÜZENLEME: küçük bir hata, "onbeforunload" :) Chrome ve diğer tarayıcılar, yüklemeden önce son kaydırma konumunu "hatırlar", bu nedenle, değeri, sayfanızın boşaltılmasından hemen önce 0,0 olarak ayarlarsanız 0,0'ı hatırlar ve kazanır Kaydırma çubuğunun olduğu yere geri kaydırın :)

JQuery .scrollTop()işlevini buradan kontrol edin

Bir şeye benzeyecekti

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

Ayrıca deneyebilirsin

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

X konumunda kaydırmak istiyorsanız, 0 değerini x olarak değiştirebilirsiniz.

Bunun yerine location.reload(), sadece kullanın location.href = location.href. Yaptığı gibi önceki konuma kaydırılmayacaktır location.reload().

Not: URL'de # varsa bu yeniden yüklenmez

<script> location.hash = (location.hash) ? location.hash : " "; </script>

Yukarıdaki komut dosyasını <head>html'nizin etiketine koyun . Tek sayfalı uygulamaların nasıl davrandığından emin değilim! Ama normal sayfalarda kesinlikle cazibe gibi çalışıyor.

Cevap burada (içeri kaydırarak $(document).readySayfada bir video varsa buradaki ) işe yaramaz. Bu durumda, bu olay tetiklendikten sonra sayfa kaydırılır ve bizim çalışmamızı geçersiz kılar.

En iyi cevap şu olmalıdır:

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

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

google chrome sayfanın yüklenmesi bittikten sonra aşağı kaydıracağından benim için işe yaramadı. Ne kullandım

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

// Bu, sayfayı sonunda bir # ile yükler. Böylece her zaman en üstte yüklenecektir.

Pencereyi sıfırlamak için en üste geri dönün $(window).scrollTop(0), yükleme öncesi olayında püf noktaları var, ancak Chrome 80'de test ettim, yeniden yüklemeden sonra eski konumuna geri dönecek.

Bunu önlemek için, set history.scrollRestorationiçin "manual".

//Reset scroll top

history.scrollRestoration = "manual";

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

Süperkalifragilisticexpialidocious cevap:

bunu js dosyanızın veya komut dosyası etiketinizin en üstüne ekleyin

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

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