如何从 Jquery Mobile 历史记录中删除当前页面？

Question

有没有办法从 Jquery Mobile 历史记录中删除当前页面（导航离开的页面）？设置 changeHash:false 似乎会从历史记录中删除传入页面。

这是一个例子：

第 1 页

<div data-role="page">
  <div data-id="fixedheader" data-role="header" data-position="fixed">
    <h1>Page 1</h1>
  </div>
  <div data-role="content">
    <button onclick="$.mobile.changePage('page2.html',{changeHash:false});">Page 2</button>
  </div>
</div>

第 2 页

<div data-role="page">
  <div data-id="fixedheader" data-role="header" data-position="fixed">
    <h1>Page 2</h1>
  </div>
  <div data-role="content">
    <button onclick="$.mobile.changePage('page3.html',{changeHash:true});">Page 3</button>
  </div>
</div>

第 3 页

<div data-role="page">
  <div data-id="fixedheader" data-role="header" data-position="fixed" data-add-back-btn="true">
    <h1>Page 3</h1>
  </div>
  <div data-role="content"></div>
</div>

我想要的是，当在第 3 页时，单击后退按钮会转到第 2 页，并且无法返回到第 1 页。

从第 1 页点击到第 2 页再到第 3 页，在第 3 页上的后退按钮直接返回到第 1 页。

此外，如果我将 data-add-back-btn="true" 放在第 2 页上，它会显示一个后退按钮，但单击它什么也不做。

Answer 1

假设您使用的是jQuery Mobile > 1.4，您可以直接使用$.mobile.navigate.history.stack访问和修改历史堆栈

如果您只想在从第 1 页 -> 第 2 页导航时从历史记录中删除第 1 页，则以下代码应该可以解决您的问题。此函数假定 jQuery Mobile 1.4.3

$(document).on('pagecontainerchange', function(e, ui) {
      if ( ui.prevPage.attr('id') === 'first' && ui.toPage.attr('id')  === 'second' ) {
          var index = $.mobile.navigate.history.stack.length - 2;
          $.mobile.navigate.history.stack.splice(index, 1);
    }
});

Here is a fiddle 记录历史堆栈的状态