jQuery mobile如何在changePage之后强制目标页面刷新 [英] Jquery mobile how to force target page refresh after changePage

查看:106
本文介绍了jQuery mobile如何在changePage之后强制目标页面刷新的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

Is there any way to refresh the target page after changePage.

我确实在搜索,但是对我没有用.

I really search but nothing works for me.

推荐答案

尝试以下解决方案之一:

Try one of the following solutions:

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

示例:

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

Since you're using single page template, let's suppose that you have two jQuery Mobile pages (#page_1 and #page_2) in 2 separate HTML files (page_1.html and page_2.html).

如果要从#page_1(位于page_1.html中)导航至#page_2(位于page_2.html中),请使用:

If you want to navigate from #page_1 (which is in page_1.html) to #page_2 (which is in page_2.html), you'd use:

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

检查下面的完整示例:

Check the complete example below:

- 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 });


2 - Try using $.mobile.changePage("your_html.html", { reloadPage: true });

考虑上一个示例,并假设您要从#page_1导航到#page_2,只需将方法$(location).attr('href',"page_2.html");替换为:

Considering the previous example, and supposing that you want to navigate from #page_1 to #page_2, you'd simply have to replace the method $(location).attr('href',"page_2.html"); with:

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

有关方法$.mobile.changePage()及其选项reloadPage的更多信息,请检查以下链接:

For more information about the method $.mobile.changePage() and its option reloadPage, check the following link: http://jquerymobile.com/demos/1.1.0/docs/api/methods.html

这篇关于jQuery mobile如何在changePage之后强制目标页面刷新的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆