返回上一个滚动位置 - jquery 移动页面设计

Question

我有一个简单的单页架构。在第一页中，我加载了一些列表项。接下来，我滚动列表并说我到达了第 60 项。然后我单击了该项目，它把我带到了第二页。

<div data-role="page" id="home">
    <div data-role="header" data-position="fixed" data-tap-toggle="false"> <a href="#" class="ui-btn ui-btn-left" id="current">0</a>
        <h1>Header</h1>
        <a href="#" class="ui-btn ui-btn-right" id="total">0</a>
    </div>
    <div role="main" class="ui-content">
        <ul data-role="listview" id="list"></ul>
    </div>
    <div data-role="footer" data-position="fixed" data-tap-toggle="false">
        <h1>Footer</h1>
    </div>
</div>
<div data-role="page" id="page2">
    <div data-role="header" data-position="fixed" data-tap-toggle="false"> 
        <a href="#home" class="ui-btn ui-btn-left">Back</a>
        <h1>Header</h1>
    </div>
    <div role="main" class="ui-content">
        Some page
    </div>
    <div data-role="footer" data-position="fixed" data-tap-toggle="false">
        <h1>Footer</h1>
    </div>
</div>

现在，当我在第二页按下back 按钮时，它会显示列表的第一页，但滚动位置为 0。我希望它是第 60 项的位置。我错过了什么？如何回到我离开滚动的上一页？

JsFiddle

通过滚动查看情况，然后按任意按钮，然后按back 按钮。

Answer 1

当从一个page1导航到page2时获取page1的滚动位置，当从page2返回到page1时设置滚动位置。

从第 1 页到第 2 页

var scrollPosition= $("div").scrollTop();

当回到第 1 页时。然后在第1页准备功能

$(document).ready(function(){  
$("div").scrollTop(scrollPosition); 

});

Answer 2

我不太了解jquery mobile，但正如您所说，您有两个页面，在导航回您想要的第一页之后，我们都知道我们无法明智地存储任何数据页面。一旦刷新或重新加载页面，一切都会重新初始化。所以你只有一种方法可以实现你的目标，当你点击列表项时，获取它的当前滚动位置并将该位置作为查询字符串参数发送到另一个页面并将其存储在一个变量中。当用户单击“返回”按钮后不久，您必须再次将该变量作为查询字符串发送到第一页，并且在文档就绪事件中，您将拥有先前的滚动位置，您可以设置它。 谢谢