Jquery Mobile - 与页面一起加载脚本（pagecontainershow）答案

【问题标题】：Jquery Mobile - load script along with page (pagecontainershow)Jquery Mobile - 与页面一起加载脚本（pagecontainershow）
【发布时间】：2014-02-07 03:30:19
【问题描述】：

我正在使用 jQuery Mobile 1.4.0 构建一个移动 Web 应用程序，并且出于组织目的，我为每个页面使用不同的 html 文件，因为这将是一个相当大的应用程序。

我知道该文档未在辅助页面上使用，因为 jQuery Mobile 中的链接通过 AJAX 从文件中提取 data-role="page" 内部的信息并将其插入 dom 并显示它。我没问题。

我希望文件中的 javascript 也能够被使用（我不想使用 data-ajax=false 并丢失转换等）。阅读文档后，我认为我可以使用：

$(document).on('pagecontainershow', function(event, ui) { });

得到我想要的结果。这在第一页上工作正常，但在后续页面上不起作用，除非我在新选项卡/会话中手动将该 URL 输入到浏览器中。所以我尝试了

$('#pageid').on('pagecontainershow', function(event, ui) { });

认为这可能会奏效，希望 jQM 知道通过使用正确的 ID 将其与该页面一起拉出。但是，这根本不起作用。

所以现在我被困住了。任何人都可以帮忙吗？我无法想象我是唯一一个不想在主页上保留成千上万行 javascript 的人。

提前致谢

【问题讨论】：

将js文件/代码放在页面div中，这样就可以在不关闭ajax的情况下加载。
将此作为答案而不是评论发布，我会将您的答案标记为正确。谢谢！

标签： jquery jquery-mobile

【解决方案1】：

jQuery Mobile 通过 HTTP 加载第一页，其余的 external 页面通过 Ajax 加载。在单页模型中，它首先在<body> 中加载data-role="page"，并忽略data-role="page" 之外的其余元素。

要克服这个问题并加载不包含在首页中的不同库，您需要将它们放在任何外部页面的data-role="page" 中。

如果关闭 ajax data-ajax="false"，页面将通过 HTTP 正常加载。

【讨论】：