瀏覽器持久滾動位置

當我使用firefox並滾動無限滾動div並重新加載頁面時，我滾動回最後一個會話滾動位置。瀏覽器持久滾動位置

這是一個live test頁面。

該錯誤可以通過以下步驟重現。

1st。在Firefox上加載頁面。
2nd。點擊「點擊我」文本。
3rd。將列表向下滾動到頁面的midle。
4th。重新加載頁面「WITHOUT」清除緩存。
5th。再次點擊「點擊我」文本。
6。觀察位置。

我知道如何通過使用PHP版本化網站來解決這個問題，但我想要另一種方式。

我們不是要求您重現您的整個代碼，但至少需要創建一個[** minimal，具體且可驗證的示例**]（http://stackoverflow.com/help/mcve）來演示您想要的內容實現。 – Terry 2015-04-01 11:26:10

@Terry我創建了一個簡單的代碼示例。重新創建問題： - 點擊「#trigger」。 - 滾動幾次。 - 刷新頁面。 - 再次點擊「#trigger」。當列表被填充時，頁面將向下滾動上次滾動的位置。僅限Firefox。 – 2015-04-01 12:01:51

我認爲你不能訪問它。

您需要爲每個要鏈接到的元素提供一個ID，以便您可以引用它。例如：

$('#target').append('<li id="result'+i+'">Item'+i+'</li>');

當您滾動時將結果添加到結尾稱爲無限滾動。

在滾動時，您需要在url中記錄#fragment或使用history.pushState()更新url。還有就是在這個線程存儲這些信息的兩種方法進行一些討論：

當用戶回來，你應該在頁面加載做此頁：

2015-04-01 12:14:50 rtpHarry

我不太確定我是否理解你的建議。你能更清楚一點嗎？感謝您的時間。 – 2015-04-01 12:27:12

你需要[這樣的東西]（http://scrollsample.appspot.com/items）。注意，當你滾動它時，會在頁面頂部添加一個頁面= 5等。如果你離開了頁面並回到頁面，那麼你可以使用這個頁面= 5來確定你需要向下滾動多少。 – rtpHarry 2015-04-01 13:09:26

我的問題是我根本不想滾動用戶。我想追加元素的位置留下來。和Chrome和IE一樣。 Firefox是唯一具有此功能的瀏覽器。 – 2015-04-01 13:12:54

當文檔準備好，$(this)指window.document，當我們做$(this).scrollTop(0);它把滾動條到窗口對象的頂部位置。嘗試類似這樣的：

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

2015-04-01 14:19:46

不錯，但考慮解釋你的anwser :) – 2015-04-01 17:47:00

當文檔準備好時，$（this）引用window.document，當我們做$（this）.scrollTop（0）;它將滾動條帶到窗口對象的頂部位置 – 2015-04-02 00:55:44

您應該編輯您的anwser並在其上添加解釋。我爲你做了。它可以幫助其他用戶找到解決方案:) – 2015-04-02 02:44:37

我發現解決緩存問題的唯一可能的方式是「版本控制」。版本控制強制瀏覽器從服務器獲取頁面，而不是緩存。

這很容易通過提供一個get參數給你想要每次刷新的url。一個簡單的代碼是這樣的。

<?php 
    <a href="your/url.com?v=".time()> a random text </a> 
?>

此外，您將不得不對目標頁面進行版本控制。這也是要做的。

<?php 
    if(isset($_GET['v']) && $_GET['v']!=time()){ 
     header("location: your/url.com?v=".time()); 
    } 
?>

前面的代碼檢查是否設置了「GET」參數「v」並且不等於Now Timestamp。
如果這是真的，那麼Web服務器會將用戶重定位到同一頁面，但具有更新的參數，從而請求來自服務器的頁面而不是緩存。

這是通過php以編程方式強制清除緩存的唯一方法。

2015-04-02 07:20:27

回答