0

我正在使用一个移动应用程序，其中第一页有

html 

    <ul>
    <li>121212</li>
    <li>123233</li>
    <li>232323</li>
    <li>4323423</li>
    <ul>

当用户单击“li”时，他/她进入下一页，该页面将通过 检索与所选“li”相关的数据Ajax。这几乎进展顺利..

但是当Ajax响应页面波动2次时。意味着一次页面加载，下一次页面完全白色，然后再次显示页面Ajax响应。为什么 ？？？

J查询 

 $("clickOnLi").click(function(){
        var id= $(this).val(); //get the selected li value
        $('.loadingGif').css({ 'display':'block' });
        $("#ulShowContent").html(''); // to remove old inner HTML to show new result html
        var dataString = 'selectedid='+id;
        $.ajax({
            type: "POST",
            url: remoteUrl+"handler.php",
            data : dataString,
            cache: true,
            success: function(response) {
                if(response){
                    $('.loadingGif').css({ 'display':'none' });
                    $("#ulShowContent").html(response); 
                }
                }
        });
    })



**and the result will show in this html** 


<ul id="ulShowContent" data-role="listview"> 
    <li class="comment chatsend">
        <div class="comment-meta">
            data 1
        </div>
    </li>

    <li class="comment chatsend">
        <div class="comment-meta">
            data 2
        </div>
    </li>
</ul>
4

1 回答 1

1

您将需要更改处理页面更改和AJAX调用的方式。

我从你的问题中了解到，点击LI元素后，页面更改被初始化并将AJAX调用发送到PHP服务器。

您将需要更改此逻辑。页面波动是由AJAX在从一个页面转换到另一个页面期间执行的调用引起的。

这可以像这样修复：

  • 在第一页HREF从列表元素中删除属性
  • 为每个列表元素添加点击事件
  • AJAX调用应在点击事件上执行，同时显示您的自定义加载器（或使用默认加载器）
  • 当检索到服务器端数据时，您需要存储它，以便可以从另一个页面访问它。在这里你会找到我的另一个答案，在那里你可以找到在页面转换期间存储数据的各种方法，或者在这里找到它，只需搜索一个名为：页面转换之间的数据/参数操作的章节（你最好的选择是 a localstorage）。
  • changePage使用函数初始化页面更改
  • 在pagebeforeshow事件期间（页面尚未显示）将新数据附加到新容器
  • 当最终显示第二页时，一切都会在那里，并且
于 2013-02-22T09:09:22.260 回答