Question

这是2011年6月3日，我正在使用JQuery Mobile的最新版本。

我的问题是后退按钮已经消失了。

我怎样才能让后退按钮出现？

更新：

我已经尝试了这个但仍然没有回按钮。

<body> 
<div data-role="page" data-theme="a" data-iscroll="enable" data-add-back-btn="true">

    <div data-role="header" data-theme="a" data-backbtn="true">
        <h1>title here</h1>

        <a href="index.php" data-icon="home" data-iconpos="notext" data-direction="reverse" class="ui-btn-left jqm-home">Home</a>
        <a href="view.php" data-icon="arrow-r" data-theme="a" data-iconpos="right">Events</a>
    </div><!-- /header -->

    <div data-role="content">

Answer 1

如果查看jQuery mobile blog post in may，默认情况下后退按钮现已关闭。

要重新启用后退按钮，只需将data-add-back-btn="true"添加到页面容器中：

<div data-role="page" id="page1">
    <div data-role="header">
        <h1>First page</h1>
    </div>
    <div data-role="content">
        <p><a href="#page2">page2</a></p>
    </div>
    <div data-role="footer">
        <h4>Optional footer</h4>
    </div>
</div>
<div data-role="page" id="page2" data-add-back-btn="true">
    <div data-role="header">
        <h1>Second Page</h1>
    </div>
    <div data-role="content">  
        <p><a href="#page1">page1</a></p>
    </div>
    <div data-role="footer">
        <h4>Optional footer</h4>
    </div>
</div>

<强> Example of the back button on jsfiddle

Answer 2

如果你仍然没有看到它并且你的标记都是正确的，Mark的评论很有帮助：

假设您导航到另一个页面

我在添加属性时正在测试的页面上没有看到后退按钮：

data-add-back-btn="true"

这是因为浏览器的该选项卡上没有浏览器历史记录，因此没有后退按钮的机会。如果我导航到我从另一个页面测试的页面，那么我会看到后退按钮。

Answer 3

由于后退按钮现在默认关闭，您需要在加载jQuery mobile之前（以及加载jQuery之后）将其打开：

    <script type="text/javascript">
$(document).bind("mobileinit", function() {
      $.mobile.page.prototype.options.addBackBtn = true;
 });    
</script>

另外，为了防止后退按钮有时弹出不应该出现的位置，请输入：

data-add-back-btn="false"

在您不想再查看按钮的所有页面上分页容器。

Answer 4

在标题div标记

中包含data-add-back-button =“true”

<div data-role="page" id="page1">
    <div data-role="header">
        <h1>First page</h1>
    </div>
    <div data-role="content">
        <p><a href="#page2">page2</a></p>
    </div>
    <div data-role="footer">
        <h4>Optional footer</h4>
    </div>
</div>
<div data-role="page" id="page2">
    <div data-role="header" data-add-back-btn="true">
        <h1>Second Page</h1>
    </div>
    <div data-role="content">  
        <p><a href="#page1">page1</a></p>
    </div>
    <div data-role="footer">
        <h4>Optional footer</h4>
    </div>
</div>

Answer 5

虽然我已经尝试了上述所有步骤，但我遇到了同样的问题。我也找到了问题和解决方案。

问题：后退按钮位于标题的左侧，此位置可能已存在按钮。

解决方案：通过向按钮添加class =“ui-btn-right”来移动标题右侧的按钮

Answer 6

添加此代码

<script>
     $(document).bind("mobileinit", function() {
          $.mobile.page.prototype.options.addBackBtn = true;
     });
</script>

之前定义

<script type="text/javascript" src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>

JQuery Mobile最新2011年6月3日版 - 没有后退按钮

6 个答案: