我使用$ .ajax()来填充我的移动网络应用程序中的列表。我想做的是在执行此调用时显示jQuery移动加载旋转器，并在列表填充后消失。当前版本的JQM使用$ .mobile.showPageLoadingMsg()和$ .mobile.hidePageLoadingMsg()分别显示和隐藏加载微调器。我不知道在哪里准确地放置这些语句以获得正确的结果。这似乎应该是一个相当容易的事情来完成，我只是没能找到任何关于这个确切的情况。
这里是ajax调用里面的pagecreate函数：
$('#main').live('pagecreate',function(event) {
$.ajax({
url: //url
dataType: 'json',headers: //headers
success: function(data) {
for(i = 0; i < data.length; i++) {
$('#courses').append('<li>' + data[i].name + '<ul id="course' + data[i].id + '"></ul>' + '<span class="ui-li-count">' + data[i].evaluatedUserIds.length + '</span></li>');
$('#course' + data[i].id).listview();
for(j = 0; j < data[i].evaluatedUserIds.length; j++) {
$('#course' + data[i].id).append('<li><a href="">' + data[i].evaluatedUserIds[j] + '</a></li>');
}
$('#course' + data[i].id).listview('refresh');
}
$('#courses').listview('refresh');
}
});
});
您可以使用$ .ajax的beforeSend和complete事件调用$ .mobile.showPageLoadingMsg和$ .mobile.hidePageLoadingMsg。看起来像这样：
$('#main').live('pagecreate',function(event) {
$.ajax({
beforeSend: function() { $.mobile.showPageLoadingMsg(); },//Show spinner
complete: function() { $.mobile.hidePageLoadingMsg() },//Hide spinner
url: //url
dataType: 'json',headers: //headers
success: function(data) {
//...
}
});
});