0

索引.html

    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css">
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></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="reviewsPage">
        <div data-role="header">
            <h1>Reviews</h1>
            <a href="twitter.html" id="twitterBtn" class="ui-btn-right"
            >TWEET</a>
        </div>

    </div>
    <script type="text/javascript">
        $(document).on("pageinit", "#reviewsPage", function(event) {
            $("#twitterBtn").bind("click", function(e) {
                $.mobile.showPageLoadingMsg();

                $.mobile.loadPage("twitter.html", {
                    reloadPage :false
                });

            });
        });

    </script>

</body>

上面显示了我的 index.html 文件，它加载了 twitter.html 文件。

twitter.html

   <div data-role="page" id="twitterPage">

   <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>


     <script type="text/javascript">
      $( "#twitterPage" ).live("pagebeforecreate", function(){{
        alert("shdgs");
       $.ajax({
        url : " searchresult.php",
        success : function(data) {
            alert("dsds");
            var markup = "";
            $.each(data, function(i, elem) {
                var $template = $('<div><li><img class="ui-li-icon profile"><p class="from"></p><p class="tweet"></p></li></div>');
                $template.find(".from").append(elem['a']);
                //$template.find(".tweet").append(result.text);
                //$template.find(".profile").attr("src", result.profile_image_url);
                markup += $template.html();

            });
            $("#tweet-list").append(markup).listview("refresh", true);

            $.mobile.changePage($("#twitterPage"));
        },

        error : function(request, error) {
            // This callback function will trigger on unsuccessful action
            alert(error);
        }
    });

});

当索引 html 调用 twitter.html 文件时。屏幕将被替换为 twiter.html w 文件而没有数据。但是如果我直接运行 twitter.html 数据将被填充。

4

1 回答 1

0

将bodyHTML 文件保存为：

<div data-role="page" id="reviewsPage">
    <div data-role="header">
         <h1>Reviews</h1>
         <a id="twitterBtn" class="ui-btn-right">TWEET</a>
    </div>
</div>
<div data-role="page" id="twitterPage">
    <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>

在 javaScipt 代码更改loadPage为changePage（将两个 js 代码放在同一个文件中）：

$("#twitterBtn").bind("click", function (e) {
    $.mobile.showPageLoadingMsg();

    $.mobile.changePage("#twitterPage", {
        reloadPage: false
    });

});

请参阅此工作版本：http: //jsfiddle.net/NrCGb/272/

于 2013-10-17T06:51:47.223 回答