我有一个包含几个页面的 html 文件，当用户按下特定页面上的按钮时，我正在加载一个包含结果页面的新 html 文件。 页面加载工作得很好，问题是我无法在新 html 中的新页面之间导航。 当我在浏览器上手动加载页面时，它工作得很好。
有人知道为什么吗？ 我想我需要在加载完成后对页面执行一种刷新操作，但我不会这样做，因为页面从远程服务器检索数据，我不知道刷新操作是否会尝试再次从远程服务器检索数据（这将重复用户等待他得到答案的时间）。
这是我使用的代码行： $.mobile.changePage("menu.php?q="+query, { transition: "slide"} );
谢谢
【问题讨论】：
标签： jquery-mobile
... the problem is that i can't manage to navigate between the new pages in the new html.
这一行让我相信您正在尝试为远程 URL 链接返回多页模板（这意味着您按下的链接不会链接到同一文档上的伪页面，而是链接到另一个文档一起）。默认情况下，jQuery Mobile 不允许这样做（我认为您可以找到该功能的插件）。 jQuery Mobile 仅从返回的外部文档中检索第一个 data-role="page 或 data-role="dialog" 元素。
您可以使用单页模板，其中每个伪页面都包含在其自己的文档中，您可以通过普通 URL 链接到每个伪页面（例如“/contact-us/index.php”）
或
您可以将所有必要的页面放在一个文档中，并使用基于哈希的链接（例如“#home”）在它们之间进行链接。执行此操作时，您仍然可以从数据库中检索数据，但您必须通过 AJAX 创建代码来执行此操作（并且很可能绑定到页面事件）。
或
也许有一个插件。如果没有，其实做起来并不难，你只需要自己抓取外部的data-role="page"元素，而不是让jQuery Mobile来做，把它们全部添加到DOM，然后像往常一样过渡到第一个.
更新
如果你想一次加载多个伪页面，试试这个：
//hijack link clicks on links with the `click-hijack` class
$(document).on('click', '.click-hijack', function () {
//show loader
$.mobile.loading('show');
//create AJAX request for pseudo-page(s)
$.ajax({
url : $(this).attr('href'),
dataType : 'html',
success : function (response) {
//hide loader
$.mobile.loading('hide');
//get the pseudo-page(s) from the AJAX response
var $pages = $(response).find('[data-role="page"], [data-role="dialog"]');
//append the pseudo-page(s) to the DOM
//(this may need to change if you are using a framework like ASP.NET as they can add wrapper DOM elements)
$("body").append($pages);
//now that the pesueo-page(s) is/are in the DOM, we can transition to them normally
$.mobile.changePage('#' + $pages.eq(0).attr('id'));
},
error : function () {
//don't forget to handle errors
}
});
//stop the default behavior of the link, as well as propagation of the click event
return false;
});
注意：此代码未经测试，请在使用代码时考虑到这一点。
【讨论】：
默认情况下，在 jQuery Mobile 中，当您链接到外部页面 via ajax 时，jQuery Mobile 只会拉取第一个 data-role="page"，或者如果找不到，它将获取内容并将其包装在数据角色中="页面" div。
您可以通过链接到没有 ajax 的页面来链接到外部多页文档（在您的链接中添加 data-ajax="false"）。
如果您想通过 ajax 一次加载多个页面，您可以使用 @Jasper 建议的方法自己手动完成，也可以使用专门为此目的制作的 jQuery-Mobile-Subpage-Widget。
【讨论】：