JQM 1.3 滚动视图 1.3.1
我有一个使用 data-iscroll 的事件链接列表。每个事件也是一个列表(标题/日期位置/描述)。
每次单击事件列表时,都会显示该事件。如果我向下滚动内容,当我返回事件列表然后单击另一个事件时,视图会滚动到上一个视图停止的位置。
我通过在事件内容上启动 empty() 然后在事件内容的后退按钮上调用 updatelayout 成功地阻止了这种情况:
$("#bhome").on('vclick', function(e) {
$('#econt').empty().trigger('updatelayout');
$.mobile.loading('show');
e.preventDefault();
$.mobile.changePage("#page1");
});
但是,当然,android 用户不使用后退按钮,而是使用后退键。
我试图在 pagebeforehide 事件上清空()和更新布局,但显然,该位置在该事件发生之前被保存:
$('#event').on('pagebeforehide', function(event, data) {
$('#econt').empty();
$('#econt').trigger('updatelayout');
$('#escroll').trigger('updatelayout');
});
我也尝试过使用silentscroll 功能,但它也不起作用:
$(document).on('pageshow', '#event', function(){
$.mobile.silentScroll(0);
});
如何确保在查看新活动时,位置回到顶部?
这是我的 index.html 文件的片段:
<div id='container'>
<div data-role='page' id='page1' data-theme="c" style="background: black;">
</div>
<div data-iscroll style='background-color:#ddd;'>
<ul id="el"></ul>
</div>
<div data-role='footer' data-position='fixed' data-theme="a" data-tap-toggle="false">
</div>
</div>
<div data-role="page" id="event" data-theme="c" style="background:black;">
<div data-role='header' data-position='fixed' data-theme="a" style="height:42px;">
<a id="bhome" class="ui-btn-left ret" data-icon="arrow-l" href="#" data-iconshadow="false">Back</a>
<h1 id='eh1'></h1>
</div>
<!-- data-role='content' entraine un scroll horizontal -->
<div data-iscroll style='background-color:white;' id='escroll'>
<ul id='econt'></ul>
</div>
</div>