如何让iscrollview在新显示屏上显示?

时间:2013-08-18 12:03:44

标签: jquery-mobile 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用户不使用后退按钮而是使用后退键。

我尝试在pagebeforehide事件中清空()和updatelayout,但显然,在该事件发生之前保存了该位置:

$('#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 个答案:

答案 0 :(得分:0)

答案是由iscrollview作者给出的(完美地运作):

$("#escroll").iscrollview("scrollTo", 0, 0, 0, false);