Question

我有一个名为index.html的页面，当我单击索引html中的链接时，它将导航到另一个页面，其中Listview填充了从Server获取的数据。这没有任何错误。

但是，当我点击当前页面的后退按钮时，我将转到上一页。

我的问题是，它会刷新当前页面，然后返回上一页。我需要阻止这一点。

的index.html

<!DOCTYPE HTML>
    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
            <title>Untitled Document</title>
            <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" />
            <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
            <script language="text/javascript">
                /* VERY IMPORTANT this is before loading jquery.mobile JS */
                $(document).on("mobileinit", function() {
                    // Make your jQuery Mobile framework configuration changes here!
                    $.mobile.allowCrossDomainPages = true;
                    $.mobile.ajaxEnabled = true;
                });

            </script>
            <script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
            <script type="text/javascript">
                $(document).on("pagebeforeshow", function(event) {
                    $("#mybtn").bind("click", function(e) {
                        $.mobile.showPageLoadingMsg();
                        $.mobile.changePage("twitter.html", {
                            reloadPage: true, changeHash: true
                        });

                    });
                });

                $(document).on("pagehide", "div[data-role=page]", function(event) {
                    $(event.target).remove();
                });

            </script>
        </head>

        <body>
            <div data-role="page" id="reviewsPage">

                <div data-role="header">
                    <h1>Reviews</h1>
                    <a href="#" id="mybtn" class="ui-btn-right" data-ajax="false" >TWEET</a>
                </div>

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

tweet.html

 <div data-role="page" id="twitterPage"  >
    <script type="text/javascript">

        $(document).on("pagehide", "div[data-role=page]", function(event) {
            $(event.target).remove();
        });

         $(document).bind('pagebeforeshow', '#twitterPage', function(){

        });
    </script>

    <div data-role="header" data-add-back-btn="true" data-back-btn-text="Previous" >
        <a href="#" data-rel="back" data-icon="arrow-l">Back</a>

    </div>
    <div data-role="content">
        <ul id="tweet-list" data-role="listview" data-inset="true">
            <li data-role="list-divider">
                <p>
                    Tweets
                </p>
            </li>
        </ul>
    </div>
</div>

Answer 1

取消绑定所有事件

 `  $("#mybtn").unbind();`

后退按钮刷新当前页面

1 个答案: