1

有什么办法可以在changePage 之后刷新目标页面。

我真的在搜索,但没有什么对我有用。

4

2 回答 2

3

这可能是您(或其他人)真正想要的:

data-ajax="false"

<a href="/" data-ajax="false">
    <img id="mainLogo" src="logo.svg" width="215" />
</a>

这将绕过 ajax 行为。

没有 Ajax 的链接

指向其他域或具有 rel="external"、data-ajax="false" 或 target 属性的链接将不会被 Ajax 加载。相反,这些链接将导致整个页面刷新而没有动画过渡。两个属性(rel="external" 和 data-ajax="false")具有相同的效果,但语义不同:链接到另一个站点或域时应使用 rel="external",而 data-ajax=" false" 对于简单地选择域中的页面不通过 Ajax 加载很有用。由于安全限制,框架总是选择链接到外部域的 Ajax 行为。

于 2014-04-09T01:59:21.913 回答
1

尝试以下解决方案之一:

1 -使用$(location).attr('href',"your_html.html");

例子:

由于您使用的是单页模板,因此假设您在 2 个单独的 HTML 文件(和)中有两个 jQuery Mobile 页面(和#page_1)。#page_2page_1.htmlpage_2.html

如果您想从#page_1(which is in page_1.html) 导航到#page_2(which is in page_2.html),您可以使用:

$(location).attr('href',"page_2.html");

检查下面的完整示例:

- page_1.html

<html>
    <head>
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile.structure-1.1.1.min.css" />
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" />
        <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script>

        <script>
            $(function() {
                $("#mlink").click(function() {
                    $(location).attr('href',"page_2.html");
                });

                $("#mlink_2").click(function() {
                    $(location).attr('href',"page_1.html");
                });
            });
        </script>
    </head>

    <body>
        <div id="page_1" data-role="page">
            <div data-role="content">
                PAGE 1<br>

                <!-- WHEN CLICKING ON THIS LINK, YOU'LL GO TO #page_2 in page_2.html 
                WITH PAGE REFRESH -->
                <a id="mlink">GO TO PAGE 2</a>
            </div>
        </div>
    </body>
</html>

- page_2.html

<html>
    <head>      
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile.structure-1.1.1.min.css" />
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" />
        <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script>          

        <script>
            $(function() {
                $("#mlink").click(function() {
                    $(location).attr('href',"page_2.html");
                });

                $("#mlink_2").click(function() {
                    $(location).attr('href',"page_1.html");
                });
            });
        </script>
    </head>

    <body>
        <div id="page_2" data-role="page">
            <div data-role="content">
                PAGE 2<br>

                <!-- WHEN CLICKING ON THIS LINK, YOU'LL GO TO #page_1 in page_1.html 
                WITH PAGE REFRESH -->
                <a id="mlink_2">GO TO PAGE 1</a>
            </div>
        </div>          
    </body>
</html>

2 -尝试使用$.mobile.changePage("your_html.html", { reloadPage: true });

考虑到前面的示例,并假设您想从 to 导航#page_1#page_2您只需将该方法替换为$(location).attr('href',"page_2.html");

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

有关该方法$.mobile.changePage()及其选项的更多信息reloadPage,请查看以下链接:http: //jquerymobile.com/demos/1.1.0/docs/api/methods.html

于 2012-09-29T06:44:39.143 回答