jquery、jquery mobile浏览器后退按钮问题

Question

这是我的 jquery 移动页面的自动页面转换问题。请提供任何帮助。

我在页面 A，单击链接，然后转到页面“B”。现在，我单击页面“B”中的链接转到页面 C。

在页面 CI 上，单击浏览器后退按钮（iPhone 位于左下角），它会根据需要将我带到页面 B。现在，我单击同一链接返回到页面 C。这一次，浏览器会闪烁页面“C”，但是很快就会自动加载页面“（jquery mobile 加载图像在中间，它会进行过渡幻灯片）” B”代替。当我查看顶部的 URL 时，我仍然是 pageC.html url，而不是 B。只有内容是 Page B 的。

我这样做有意义吗？怎么了？请帮助我。

更多信息：我在使用什么？

非常感谢

Answer 1

我遇到了同样的问题，并通过将 hashListeningEnabled 设置为 false 来解决它。

$.extend(  $.mobile , {
    ajaxEnabled      : false,
    hashListeningEnabled: false
});

Answer 2

$.extend( $.mobile , {
ajax启用：假，
哈希监听启用：假
});

这对我也有用。在 iPhone 5s 上，我会浏览到一个页面（使用 .pagecontainer("change") 方法）。该页面是在客户端代码中动态生成的，因此它不是实际的 URL。无论如何，我第一次使用后退按钮时，它会起作用。第二次我导航到不同的页面时，会发生转换，然后页面会快速刷新/重新加载。此后，后退按钮停止工作。

在标签中实现此代码对我有用。请确保将其放在 jquery 引用之后，但在 jquery MOBILE 引用之前。这真是令人沮丧的陷阱。我的标签如下所示：

    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript">
    $(document).bind("mobileinit", function () {
        $.mobile.ajaxEnabled = false;
        $.mobile.pushStateEnabled = false;
    });
</script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<script src="phonebook.js"></script>

Answer 3

兄弟，

我猜问题出在你的文件结构上。
您正在使用 jquery 移动库，但同时您正在使用两个页面进行转换，但这是行不通的。

Answer 4

我也有类似的问题。将 data-ajax="false" 添加到链接有时会有所帮助。

例如，更改

`<a href="#" data-role="button" id="fix_link">Another Page</a>`

TO

`<a data-ajax="false" href="#" data-role="button" id="fix_link">Another Page</a>`

有很多地方可以阅读有关 JQuery Mobile 如何加载页面和使用导航的信息，但我通过修改此内容学到了最多，有时 data-rel="external" 是某些情况。

Answer 5

如果您不使用 AJAX 导航（即您将选项 $.mobile.ajaxEnabled 设置为 false），JQuery Mobile 建议同时禁用 $.mobile.pushStateEnabled 来修复这些浏览器问题：

注意：在构建全局禁用 Ajax 导航系统或在单个链接上频繁禁用 Ajax 导航系统的 jQuery Mobile 应用程序时，我们建议禁用 $.mobile.pushStateEnabled 全局配置选项，以避免某些浏览器中的导航行为不一致。

http://demos.jquerymobile.com/1.4.2/navigation-linking-页面/

要禁用它：

$(document).bind("mobileinit", function () {
  $.mobile.ajaxEnabled = false;
  $.mobile.pushStateEnabled = false;
});