在jQuery Mobile 1.4.2中获取加载的页面

Get the loaded page in jQuery Mobile 1.4.2

本文关键字：加载 获取 jQuery Mobile      更新时间：2023-09-26

我习惯了旧的jQuery Mobile界面，我可以这样写:

$("#page").on("pageLoad", function(){
    //Do something
});

使用较新的pageContainer小部件和它的事件，我不知道要做什么检测页面被加载

例如，我需要知道如何检测#settings页面是否刚刚加载。到目前为止我能算出

$("body").on( "pagecontainerload", function( event, ui ){});

但是我没有办法知道加载了什么页面。我尝试使用返回的事件和ui值，但没有成功。

似乎我的部分问题来自于不正确使用

$("body").pagecontainer("load", "welcome.html");

我在js文件的开头使用它来将它们全部加载到DOM中。但是，当我导航到该页面时，它又从DOM中删除了。例如，我用上面的代码加载welcome.html、settings.html和devices.html。然后是像

这样的链接
<a href="#settings" class="navigation" data-icon="gear" data-transition="slide">Settings</a>

当我使用该链接进入设置页面，然后使用另一个相同类型的链接进入设备页面时，设置链接不再工作。在检查DOM时，#settings已被删除。事实上，"欢迎"也是如此。只要我从那个page导航，它就会从DOM中删除。因此，要么是我做错了什么，要么是我对页面容器小部件的理解有缺陷。

更新

基于您更新的OP， 外部页面将在您离开它们时被删除，这是jQM的默认行为。如果您想保留这些页面，您需要将data-dom-cache="true"添加到每个外部页面的页div。

您可以检索从pagecontainerload上发出的ui对象加载的页面。

$(document).on("pagecontainerload", function (e, ui) {
  var loadedPage = $(ui.page),
      pageID = loadedPage[0].id;
  if (pageID == "settings") {
    /* code */
  }
});
请注意，pagecontainerbeforeload、pagecontainerload和pagecontainerfail只在外部加载的页面上发出。此外，它们将在每次加载外部页面时触发，除非DOM缓存被启用。阅读更多关于这些事件的信息。

相关文章：