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 не используют кнопку «Назад», а вместо этого используют клавишу «Назад».
Я пытался выполнить empty() и updatelayout в событии pagebeforehide, но, по-видимому, позиция сохраняется до того, как это событие произойдет:
$('#event').on('pagebeforehide', function(event, data) {
$('#econt').empty();
$('#econt').trigger('updatelayout');
$('#escroll').trigger('updatelayout');
});
Я также пытался использовать функцию тихой прокрутки, но она тоже не работает:
$(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>