Question

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

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

点击页面#pageSearchDetail我在页面显示之前使用以下事件做某事：

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

在AjaxSearchDetail中，我从Web服务器加载一些数据并将该数据插入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)
    {

    }
}

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

1 个答案: