Question

我正在尝试绑定到无法正常工作的pagechange。鉴于以下基本页面，如何判断何时显示第2页？

<div data-role="page" id='page1'>
  <div data-role="content">
    <h3>Page 1</h3>
    <a href="#page2"
       data-role="button" data-transition="slide" data-inline="true"
       >Open Page 2</a>
  </div>
</div>

<div data-role="page" id='page2'>
  <div data-role="content">
    <h3>Page 2</h3>
    <a href="#page1"
       data-role="button" data-icon="arrow-l" data-rel="back" data-inline="true"
       >Back to page 1</a>
  </div>
</div>

的JavaScript

$("#page2").bind("pageshow", function(toPage, ui) {
  console.log($(this));
  console.log(toPage);
});

更改事件永远不会触发，但如果我使用$(document)然后它会触发，但$(this)和toPage

我想知道什么时候第一次出现page2所以我可以执行检索远程数据的功能。

Answer 1

页面事件应该这样绑定：

$(document).on("pageshow", "#page2" ,function(toPage, ui) {
   console.log($(this));
   console.log(toPage);
});

工作示例：http://jsfiddle.net/qvZst/

但是如果你想在第一次使用page2时做某事，那么你需要使用名为pagebeforecreate的页面事件

$(document).on("pagebeforecreate", "#page2" ,function() {
   console.log($(this));
   console.log(toPage);
});

不幸的是， pagebeforecreate 没有toPage，因为它是一个即将加载的页面。 pagebeforeshow 也可以使用，因为它会在显示页面之前触发，您可以使用它来访问以前的页面数据。

要了解有关网页活动及其订单的更多信息，请查看我的博客 ARTICLE 。

还有另一个解决方案，你也可以在page1的 pagebeforehide 期间执行此操作，但它会在页面的 pagebeforecreate 之后触发2.页面事件序列可以在我的文章中找到。

当有多个页面时，如何将事件绑定到元素页面显示？

1 个答案: