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

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 也是如此。一旦我离开那个页面，它就会从 DOM 中删除。所以要么我做错了什么，要么我对 pagecontainer 小部件的理解有问题。

Answer 1

更新

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

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

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

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

请注意，pagecontainerbeforeload、pagecontainerload 和 pagecontainerfail 仅在外部加载的页面上发出。此外，每次加载外部 页面时它们都会触发，除非DOM 缓存已启用。阅读有关这些事件的更多信息 here .

Demo