jQuery 移动 : Using 'data-rel="back"' with dynamic page generation

Question

我在 jquery 移动应用程序中向后移动历史记录堆栈时遇到问题。

基本上，我有三个页面:

1. 搜索表单(具有页面角色的预置 div。有限导航:仅限结果列表页面)
2. 结果列表(具有页面角色的预置 div，通过 ajax 添加结果信息。可以导航到任何记录页面)
3. 记录页面(完全动态构建。相关记录页面的无限导航可能性)

记录页面是根据表和 record_id 动态创建的，每次选择新记录时都会附加到文档正文。

var page_id = table + record_id;
var pg_html = newPageHTML(page_id );
$('body').append(pg_html);
$.mobile.changePage($("#" + page_id));

前进到记录并按“后退”按钮 (data-rel="back") 后，预期的行为是返回到上一页，无论是另一条记录还是结果列表，但我被发送了一路回到搜索表单。当我使用 data-dom-cache="true"和不使用 data-dom-cache="true"时，都会发生这种情况。

有什么解释可以解释为什么会这样吗？感谢您的帮助。

Answer 1

获取 DOM 中上一页的 ID，然后移动到该页面。

<强> Working Demo

$('.selector').on('click', function() {

 // get the ID of the previous page
 var previous = '#' + $.mobile.activePage.prev('div[data-role="page"]')[0].id;

 // move to previous page with reverse effect
 $.mobile.changePage(previous, {
  transition: 'slide',
  reverse: true
 });
});