HTML में पृष्ठ ताज़ा करने के लिए बल पृष्ठ स्क्रॉल स्थिति शीर्ष पर

129

मैं एक वेबसाइट बना रहा हूं जिसे मैं divएस के साथ प्रकाशित कर रहा हूं । जब मैं पृष्ठ को X की स्थिति पर स्क्रॉल करने के बाद पृष्ठ को ताज़ा करता हूं, तो पृष्ठ को X के रूप में स्क्रॉल स्थिति से लोड किया जाता है।

मैं पृष्ठ ताज़ा करने के लिए पृष्ठ को शीर्ष पर स्क्रॉल करने के लिए कैसे बाध्य कर सकता हूं?

क्या मैं के बारे में सोच सकते हैं के रूप में कुछ जे एस या jQuery रन की है onLoad()करने के लिए पेज के समारोह सेट पृष्ठों शीर्ष पर स्क्रॉल करें। लेकिन मुझे नहीं पता कि मैं ऐसा कैसे कर सकता हूं।
एक बेहतर विकल्प यह होगा कि पेज को स्क्रॉल करने की स्थिति में डिफ़ॉल्ट (यानी शीर्ष पर) के रूप में पृष्ठ पर लोड करने के लिए कुछ संपत्ति या कुछ है , जो पृष्ठ ताज़ा करने के बजाय पेज लोड की तरह होगा ।

— चांद
स्रोत

हैरानी की बात है कि यहां कोई भी समाधान मेरे लिए काम नहीं किया, लेकिन इस एक ने किया: stackoverflow.com/a/11486546/470749

— रयान

165

आप इसे DOM तैयार पर स्क्रॉलटॉप विधि का उपयोग करके कर सकते हैं :

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

— थपथपाना
स्रोत

9

सफारी पर काम नहीं करता है। लेकिन यह -> stackoverflow.com/a/18633915/102133 करता है।

— बेन

165

एक साधारण सादे जावास्क्रिप्ट कार्यान्वयन के लिए:

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

स्निपेट का विस्तार करें

— ProfNandaa
स्रोत

1

यह सही जवाब है। JQuery समाधान सभी मामलों में काम नहीं करता है।

— हैरी स्टीवंस

@ पॉल 12_ - मैंने अभी इसका परीक्षण किया Safari 11.0.3और मेरे लिए ठीक काम करता है, जो आप उपयोग कर रहे हैं?

— प्रोन्नंदा

इसने मेरे लिए काम नहीं किया। मुझे इसे काम करने के लिए onbeforeload फ़ंक्शन से वापस लौटना पड़ा।

— इकबाल

@ इकबाल - तुमने क्या किया return?

— प्रोन्नंदा

1

जोड़ना document.querySelector('html').style.scrollBehavior = '';भी आवश्यक हो सकता है। यदि इसे सेट किया गया था smooth, तो यह पृष्ठ पुनः लोड होने से पहले शीर्ष पर नहीं पहुंच सकता है।

— केवांक

35

यहां जवाब सफारी के लिए काम नहीं करता है, पहले से ही अक्सर बहुत जल्दी निकाल दिया जाता है।

उस beforeunloadघटना का उपयोग करना चाहिए जो आपको कुछ करने से रोकती हैsetTimeout

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

— बेन
स्रोत

1

स्क्रॉल समारोह के बाद जोड़ें: $ ('html')। पाठ (''); , इसलिए घुमक्कड़ रीसेट हो जाएगा

— user956584

1

@Userpassword आपको $ ("html") नहीं लगता है। हटाएं () बेहतर होगा?

— बेन

18

फिर से, सबसे अच्छा जवाब है:

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

(गैर- jQuery के लिए thats, ऊपर देखो अगर आप JQ विधि के लिए खोज कर रहे हैं)

संपादित करें: एक छोटी सी गलती इसकी "onbeforunload" :) क्रोम और अन्य ब्राउज़रों को याद है "अंतिम स्क्रॉल स्थिति को अनलोड करने के लिए", इसलिए यदि आप अपने पृष्ठ के अनलोड से ठीक पहले 0,0 पर मान सेट करते हैं तो वे 0,0 याद रखेंगे और जीत गए जहां स्क्रॉलबार था वहां वापस स्क्रॉल न करें :)

— xoxel
स्रोत

@ पॉल 12_ सफारी को document.documentElement.scrollTopकाम करने की आवश्यकता है। मैं आमतौर पर दोनों का उपयोग करता हूं।

— ग्राहम ओ'मोनी 13

9

JQuery .scrollTop()फ़ंक्शन की जाँच करेंयहाँ करें

यह कुछ ऐसा दिखेगा

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

— jon3laze
स्रोत

9

आप भी आजमा सकते हैं

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

यदि आप x स्थिति में स्क्रॉल करना चाहते हैं तो आप 0 से x का मान बदल सकते हैं।

— अंकित
स्रोत

7

इसके बजाय location.reload(), बस का उपयोग करें location.href = location.href। यह पिछली स्थिति पर स्क्रॉल नहीं करेगा जैसा कि location.reload()करता है।

नोट: यदि URL में कोई # है तो यह पुनः लोड नहीं होगा

— Nauphal
स्रोत

4

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

उपरोक्त स्क्रिप्ट <head>को अपने html के टैग में रखें। यकीन नहीं होता कि सिंगल पेज ऐप्स कैसे व्यवहार करते हैं! लेकिन निश्चित रूप से नियमित पृष्ठों में आकर्षण की तरह काम करता है।

— harshes53
स्रोत

4

यहाँ उत्तर (स्क्रॉलिंग इन) $(document).readyयदि पृष्ठ में कोई वीडियो है तो ) काम नहीं करता है। इस घटना के बाद इस पृष्ठ को स्क्रॉल किया जाता है, हमारे काम को ओवरराइड करने के बाद।

सबसे अच्छा जवाब होना चाहिए:

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

— DrPollit0
स्रोत

3

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

मेरे लिए काम नहीं किया क्योंकि Google क्रोम पृष्ठ को लोड करने के बाद वापस नीचे स्क्रॉल करेगा। मैंने जो प्रयोग किया था

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

// यह पेज को आखिर में # के साथ लोड करता है। तो यह हमेशा शीर्ष पर लोड होगा।

— Daut
स्रोत

3

विंडो स्क्रॉल को फिर से शीर्ष पर रीसेट करने के लिए, $(window).scrollTop(0)पहले की घटना में चालें करता है, हालांकि, मैंने क्रोम 80 में परीक्षण किया है यह पुनः लोड होने के बाद पुराने स्थान पर वापस जाएगा।

इससे बचने के लिए सेट history.scrollRestorationकरने के लिए "manual"।

//Reset scroll top

history.scrollRestoration = "manual";

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

— एलेक्स मज़ा आ रहा है
स्रोत

यह मेरे लिए सबसे अच्छी प्रतिक्रिया है, क्रोम / लिनक्स

— एसएनएस - वेब एट इंफॉर्मेटिक

0

सुपरक्लिफ़्रेगिलिस्टिसएक्सपियालिडोसियस उत्तर है:

इसे अपने js फ़ाइल या स्क्रिप्ट टैग के शीर्ष पर जोड़ें

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

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

— Nicobels
स्रोत