狗蛋的博客通过本文主要向大家介绍了ajax等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com
$(function(){
$("#loading").ajaxStart(function(){
$(this).html.("<img src='/jqueryStu/images/loading.gif' />");
});
$("#loading").ajaxSuccess(function(){
$(this).html.("");
// $(this).empty(); // 或者直接清除
});
}）;
<div id="loading"></div>
注意：
所有的ajax提交都会触发ajaxStart事件，都会在你定义的
<div id="loading"></div>位置上显示“加载中。。。”的图标（当然你也可以定义文字，但是一个加载中的图片比较好看）；//但是一定要注意，同时要定义好ajaxSuccess事件，ajax提交成功后把这个图标隐藏起来！！！
在ajax方法中定义任意位置显示的“加载中。。。”提示
$('#ajax_test2').click(function(){
$.ajax({
url ---- url路径，根据你需要些啦,
type:'post',
data:'name=ZXCVB',
timeout:15000,
beforeSend:function(XMLHttpRequest){
//alert('远程调用开始...');
$("#loading").html.("<img src='/jqueryStu/images/loading.gif' />");
},
success:function(data,textStatus){
alert('开始回调，状态文本值：'+textStatus+' 返回数据：'+data);
// $("#loading").empty();
},
complete:function(XMLHttpRequest,textStatus){
// alert('远程调用成功，状态文本值：'+textStatus);
$("#loading").empty();
},
error:function(XMLHttpRequest,textStatus,errorThrown){
alert('error...状态文本值：'+textStatus+" 异常信息："+errorThrown);
$("#loading").empty();
}
});
});
< input type.="button" id="ajax_test2" value="Ajax方式">
<div id="loading"></div>
很明显，在beforeSend时，在指定的位置显示“加载中。。。”图标，在error、complete、success后把该图标移除掉！
注意：页面有多个ajax提交时候，建议使用第二种方式，因为“加载中。。。”图标可以显示在任意你需要刷新的位置上！