Question

我已经习惯了以前写的旧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已被删除。事实上，＃welcome也是如此。一旦我离开那个page，它就会从DOM中删除。所以要么我做错了，要么我对pagecontainer小部件的理解存在缺陷。

Answer 1

更新

根据您更新的OP，外部网页一旦离开它们就会被删除，这是jQM的默认行为。如果您想保留这些网页，则需要将data-dom-cache="true"添加到每个外部网页的页面div 。

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

$(document).on("pagecontainerload", function (e, ui) {
  var loadedPage = $(ui.page),
      pageID = loadedPage[0].id;

  if (pageID == "settings") {
    /* code */
  }
});

请注意pagecontainerbeforeload，pagecontainerload和pagecontainerfail仅在 externaly 加载的网页上发出。此外，除非启用 DOM缓存，否则每次加载外部页面时都会触发它们。详细了解这些活动here。

<强> Demo

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

1 个答案:

更新