Question

我正在使用JQM 1.4.2并拥有此JS：

$.mobile.changePage( "page.html", { reloadPage: true} );

它工作正常。问题是，这将在1.5.0中弃用现在我试着用这个：

$.mobile.pageContainer.pagecontainer("change", "page.html", { reload:true } );

并且它不起作用（页面未重新加载）。如何强制页面重新加载？谢谢。

Answer 1

首先，您确定使用的是正确的jQuery Mobile 1.4版本吗？测试版的jQuery Mobile 1.4没有pagecontainer小部件。

此功能正常。

我甚至让你成为一个有效的榜样：

HTML1 - index.html

<!DOCTYPE html>
<html>
    <head>
        <title>jQM Complex Demo 1</title>
        <meta http-equiv='Content-Type' content='text/html; charset=utf-8'/>
        <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.4.2/jquery.mobile-1.4.2.min.css" /> 
        <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>    
        <script>
            $(document).on('pageinit', '#index', function(){ 
                $(document).on('click', '#changePage', function(){ 
                    $.mobile.pageContainer.pagecontainer( "change", "second.html", { reload: "true" } );
                });
            });
        </script>
    </head>
    <body>     
        <div data-role="page" id="index" data-theme="a" >
            <div data-role="header">
                <h3>
                    First Page
                </h3>
                <a href="#second" class="ui-btn-right">Next</a>
            </div>

            <div data-role="content">
                <input type="button" value="Button" id="changePage">
            </div>

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

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

HTML2 - second.html

<!DOCTYPE html>
<html>
    <head>
        <title>jQM Complex Demo 2</title>
        <meta http-equiv='Content-Type' content='text/html; charset=utf-8'/>
        <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.4.2/jquery.mobile-1.4.2.min.css" /> 
        <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>  
    </head>
    <body>     
        <div data-role="page" id="second" data-theme="a" >
            <div data-role="header">
                <h3>
                    Second Page
                </h3>
                <a href="#index" class="ui-btn-left">Back</a>
            </div>

            <div data-role="content">

            </div>

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

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

更新

从我可以看到这是一个错误。我在这里报告了它：https://github.com/jquery/jquery-mobile/issues/7406

jQuery移动更改页面不会重新加载页面

1 个答案:

HTML1 - index.html

HTML2 - second.html

更新