jquery - jQuery Mobile 在页面更改期间加载内容

Question

我的代码中有以下情况。在显示搜索结果的页面上，每个结果都有以下代码：

<a href='#pageSearchDetail'>Result</a>

单击页面#pageSearchDetail 我使用以下事件在页面显示之前执行某些操作：

$(document).delegate('#pageSearchDetail', 'pagebeforeshow', function() 
{    
    AjaxSearchDetail();        
});

在 AjaxSearchDetail 我从网络服务器加载一些数据并将这些数据插入到 DOM 中。我的问题是现在页面已经显示，尽管 ajax 请求还没有完成。因此，在 ajax 加载完成之前，页面仅显示部分且“空”。

ajax请求代码：

function AjaxSearchDetail()
{               
    var data = "&data=test";

    $.ajax({
        data: data,        
        success: Success,
        error: Error
    });
}

另一个有趣的事情是加载小部件在页面加载过程中没有显示。我究竟做错了什么 ？

Answer 1

我用以下代码解决了这个问题：

$(document).ajaxStart(function() {    
    $.mobile.loading('show');
});

$(document).ajaxStop(function() {
    $.mobile.loading('hide');
});

现在我使用：

$(document).on("pagechange", function(e, data) 
{
    var pageID = data.toPage.attr("id");

    switch (pageID)
    {

    }
}