jQuery Mobile - 后退按钮

Question

我正在使用 jQuery Mobile 4.1 开发应用程序。

在我的应用程序中，我有两个 html 页面，例如 login.html 和 home.html。在home.html中有3个页面。 () 如菜单页、搜索页、结果页。

项目流程为login.html --->主页.html。在 home.html 中，menupage 显示为第一页。如果我选择菜单页面中的某些选项，它将移至搜索页面，然后移至结果页面。考虑一下，目前我在结果页面中。如果我按移动浏览器（iPhone-safari、Android-chrome）上的后退按钮，它就会移动到 login.html。

但我想显示搜索页面。怎么解决这个问题呢？可以这样做吗？

[注意：页面应该在单个 html 页面（home.html）中。

Answer 1

在锚标记上使用属性 data-rel="back" 而不是哈希导航，这将带您到上一页

查看反向链接：此处

Answer 2

较新版本的 JQuery 移动 API（我猜它比 1.5 更新）需要在每个页面的页眉或底部显式添加“后退”按钮。

因此，尝试将其添加到页面 div 标签中：

data-add-back-btn="true"
data-back-btn-text="Back"

示例：

<div data-role="page" id="page2" data-add-back-btn="true" data-back-btn-text="Back">

Answer 3

尝试

$(document).ready(function(){
    $('mybutton').click(function(){
        parent.history.back();
        return false;
    });
});

或

$(document).ready(function(){
    $('mybutton').click(function(){
        parent.history.back();

    });
});

Answer 4

您可以在 HTML 代码的标头中尝试此脚本：

<script>
   $.extend(  $.mobile , {
   ajaxEnabled: false,
   hashListeningEnabled: false
   });
</script>

Answer 5

如果您不想跟踪历史记录，可以使用 jquery mobile 中的 nonHistorySelectors 选项。您可以在此处找到详细文档 http://jquerymobile.com/ demos/1.0a4.1/#docs/api/globalconfig.html

Answer 6

这是1.4.4版本的

  <div data-role="header" >
        <h1>CHANGE HOUSE ANIMATION</h1>
        <a href="#" data-rel="back" class="ui-btn-left ui-btn ui-icon-back ui-btn-icon-notext ui-shadow ui-corner-all"  data-role="button" role="button">Back</a>
    </div>

Answer 7

尝试用li可以更均匀

<ul>
 <li><a href="#one"  data-role="button" role="button">back</a></li>
 </ul>