当后退按钮单击时，停止Jquery Mobile重新初始化页面？

Question

我在jquery mobile中自己处理后退/前进按钮。 问题是，当用户单击后退按钮然后jquery发送ajax请求并重新初始化页面，这会弄乱我的所有工作。 我设置了data-backbtn="false"和$.mobile.ajaxEnabled = false; 但这些技巧都不适合我。 任何想法？

Answer 1

我认为你的问题也在$ .mobile.ajaxEnabled = false; 处理。

该代码示例必须从mobileinti事件触发，如下所示：

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

还有一件事，必须在jQuery Mobile初始化之前触发mobileinit事件，如下所示：

<script src="http://www.dragan-gaic.info/js/jquery-1.8.2.min.js"></script>      
<script>
        $(document).bind("mobileinit", function () {
            $.mobile.ajaxEnabled = false;
        });    
</script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>

例：

HTML 1：

<!DOCTYPE html>
<html>
<head>
    <title>jQM Complex Demo</title>
    <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=no; target-densityDpi=device-dpi"/>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
    <script src="http://www.dragan-gaic.info/js/jquery-1.8.2.min.js"></script> 
        <script>
                $(document).bind("mobileinit", function () {
                    $.mobile.ajaxEnabled = false;
                });    
        </script>         
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>   
</head>
<body>
    <div data-role="page" id="index">
        <div data-theme="a" data-role="header">
            <h3>
                First Page
            </h3>
            <a href="second.html" class="ui-btn-right">Next</a>
        </div>

        <div data-role="content">

        </div>

        <div data-theme="a" data-role="footer" data-position="fixed">

        </div>
    </div>    
</body>
</html>

HTML2：

<!DOCTYPE html>
<html>
<head>
    <title>jQM Complex Demo</title>
    <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=no; target-densityDpi=device-dpi"/>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
    <script src="http://www.dragan-gaic.info/js/jquery-1.8.2.min.js"></script> 
        <script>
                $(document).bind("mobileinit", function () {
                    $.mobile.ajaxEnabled = false;
                });    
        </script>         
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>   
</head>
<body>    
    <div data-role="page" id="second">
        <div data-theme="a" data-role="header">
            <h3>
                Second Page
            </h3>
            <a href="index.html" class="ui-btn-left">Back</a>
        </div>

        <div data-role="content">

        </div>

        <div data-theme="a" data-role="footer" data-position="fixed">

        </div>
    </div>    
</body>
</html>

Answer 2

jQuery Mobile在导航离开后从DOM中删除伪页面（仅适用于外部页面）。 您可以通过将data-dom-cache =“true”属性添加到伪页面的data-role="page"元素，在单个伪页面上停止此行为：

<div data-dom-cache="true" data-role="page">
    ...
</div>

还有其他方法可以启用（很好地禁用我猜）这个功能; 你可以在这里阅读它们

Answer 3

我最终使用这条适用于我的生产线，

$(window).off('popstate');

当后退按钮单击时，停止Jquery Mobile重新初始化页面？

问题描述

3 个解决方案

解决方案1
2 2013-03-14 13:50:18

例：

解决方案2
0 2013-03-14 13:52:58

解决方案3
0 已采纳 2013-03-17 09:36:58

当后退按钮单击时，停止Jquery Mobile重新初始化页面？

问题描述

3 个解决方案

解决方案1 2 2013-03-14 13:50:18

例：

解决方案2 0 2013-03-14 13:52:58

解决方案3 0 已采纳 2013-03-17 09:36:58

解决方案1
2 2013-03-14 13:50:18

解决方案2
0 2013-03-14 13:52:58

解决方案3
0 已采纳 2013-03-17 09:36:58