Question

我有一个单页模板页面（page1.aspx），它加载了一个多页模板页面（page2.aspx）

多页面模板页面包含将内部页面显示为对话框的按钮。当page1通过默认的AJAX行为加载page2时，第2页上的按钮不起作用。在浏览器中强制刷新page2可让第2页上的按钮工作。

如果我在第1页的链接中添加data-ajax="false"，一切都很好。

如何通过AJAX加载多页模板页面以使其上的按钮有效？

Answer 1

您无法通过AJAX链接到多页文档。只会将第一个data-role="page"元素导入DOM，其他所有内容都将被忽略（即使是<head>中的内容）。

如果链接到没有AJAX的多页面模板，则会加载整个页面，并且所有data-role="page"元素都可用。为此，您可以在特定链接上设置属性，如下所示：

<a hef="#" data-ajax="false">my link</a>

或者像这样：

<a hef="#" rel="external">my link</a>

您也可以像这样全局设置此选项：

<script src="jquery.js"></script>
<script>
$(document).bind('mobileinit', function () {
    $.mobile.ajaxEnabled = false;
});
</script>
<script src="jquery-mobile.js"></script>

<强>更新

我见过一个允许你做你想做的插件，但是我找不到它。它只是从多页文档中提取所有data-role="page"元素，而不仅仅是第一个（在我看来，这会产生一些奇怪的深层链接问题）。

<强>更新

哦，这是一个很好的：）

使用1.0版本，jQuery Mobile将允许您通过向链接添加data-prefetch="true"属性来预取页面。如果将多页模板拆分为单独的页面，则可以预先获取它们，以便将它们添加到DOM中并在单击链接时立即显示（而不是等待AJAX请求解析）

预取文档：http://jquerymobile.com/demos/1.0/docs/pages/page-cache.html

jQuery-Mobile：MultiPage模板加载但已经死了

1 个答案: