Как заставить iscrollview перейти наверх на новом дисплее?

JQM 1.3 Iscrollview 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');
});

Я также попытался использовать функцию 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>

1 ответ

Решение

Ответ дал автор iscrollview (работает отлично):

$("#escroll").iscrollview("scrollTo", 0, 0, 0, false);
Другие вопросы по тегам