作者:baiwei001 | 来源:互联网 | 2023-05-21 13:05
标题几乎说明了这一点。如何在AJAX运行时添加加载屏幕,并在AJAX运行完成后使加载屏幕消失?
我的AJAX功能:
$("#loginBtn").on("click", function(e){
e.preventDefault();
var loginForm = document.getElementById("loginForm");
var login_data = $('#loginForm').serialize();
$.ajax({
type: "POST",
url: serverURL + "loginProcess.php",
data: login_data,
dataType:"json",
success: function(data){
localStorage.setItem('id', JSON.stringify(data));
},
error: function(jqXHR, textStatus, errorThrown) {
navigator.notification.alert('Invalid Email or Password!',null,'Error', 'Done');
}
});
});
注意:我没有使用jQuery Mobile。
1> jcesarmobile..:
要在每个ajax调用上全局显示加载页面,可以使用以下代码:
$( document ).ajaxStart(function() {
$( "#loading" ).show();
});
并在ajax调用停止时将其隐藏
$( document ).ajaxStop(function() {
$( "#loading" ).hide();
});
您需要一个具有id加载的全屏div,以及一个加载图像gif或类似的东西