用于jQuery Ajax调用时显示加载进度

[js]
function show(tips){
var mainColor = "#369";
//创建一个div对象（背景层）
var bgObj = document.createElement("div");
bgObj.setAttribute("id","tips_a");
document.body.appendChild(bgObj);
bgObj.style.position = "absolute";
bgObj.style.zIndex = "9998";
bgObj.style.background = "#777";
bgObj.style.filter = "alpha(opacity=50)";
bgObj.style.opacity = "0.5";
bgObj.style.top = "0";
bgObj.style.left = "0";
bgObj.style.width = document.documentElement.scrollWidth + "px";
bgObj.style.height = document.documentElement.scrollHeight + "px";
//创建一个div对象（提示框）
var tsObj = document.createElement("div");
tsObj.setAttribute("id","tips_b");
document.body.appendChild(tsObj);
tsObj.style.position = "absolute";
tsObj.style.zIndex = "9999";
tsObj.style.background = "#fff";
tsObj.style.border = "1px solid " + mainColor;
tsObj.style.textAlign = "center";
//创建一个h4对象（标题栏/关闭）
var cls = document.createElement("h4");
cls.setAttribute("id","tips_t");
document.getElementById("tips_b").appendChild(cls);
cls.style.textAlign = "right";
cls.style.margin = "0";
cls.style.padding = "5px";
cls.style.background = mainColor;
//创建一个span对象（关闭×）
var cls_gb = document.createElement("span");
document.getElementById("tips_t").appendChild(cls_gb);
cls_gb.style.color = "#fff";
cls_gb.style.font = "12px 宋体";
cls_gb.style.cursor = "pointer";
cls_gb.innerHTML = "×";
cls_gb.onclick = hide;
//创建一个div对象（提示信息）
var strObj = document.createElement("div");
document.getElementById("tips_b").appendChild(strObj);
strObj.style.padding = "15px 30px";
strObj.style.font = "12px 宋体";
strObj.style.lineHeight = "21px";
strObj.innerHTML = tips;
//创建一个input对象（提示框按钮/关闭）
var btn = document.createElement("input");
btn.setAttribute("type","button");
btn.setAttribute("value","关闭");
document.getElementById("tips_b").appendChild(btn);
btn.style.border = 0;
btn.style.color = "#fff";
btn.style.background = mainColor;
btn.style.margin = "0 15px 15px 15px";
btn.style.padding = "0 8px";
btn.onclick = hide;
//定位提示层top/left
tsObj.style.top = document.documentElement.scrollTop + (document.documentElement.clientHeight -
tsObj.clientHeight)/2 + "px";
tsObj.style.left = (document.documentElement.clientWidth - tsObj.clientWidth)/2 + "px";
//删除提示层
function hide(){
document.getElementById("tips_t").removeChild(cls_gb);//删除标题栏里面的关闭×
document.getElementById("tips_b").removeChild(cls);//删除提示框里面的标题栏
document.getElementById("tips_b").removeChild(strObj);//删除提示框里面的提示信息
document.getElementById("tips_b").removeChild(btn);//删除提示框里面的关闭按钮
document.body.removeChild(tsObj);//删除提示框
document.body.removeChild(bgObj);//删除背景层
}
}
//创建一个div对象（背景层）
var bgObj = document.createElement("div");
//创建一个div对象（提示框）
var tsObj = document.createElement("div");
//创建一个div对象（提示信息）
var strObj = document.createElement("div");
//弹出提示层背景变灰不可操作
function showloading(){
var mainColor = "#369";
bgObj.setAttribute("id","tips_a");
document.body.appendChild(bgObj);
bgObj.style.position = "absolute";
bgObj.style.zIndex = "9998";
bgObj.style.background = "#777";
bgObj.style.filter = "alpha(opacity=50)";
bgObj.style.opacity = "0.5";
bgObj.style.top = "0";
bgObj.style.left = "0";
bgObj.style.width = document.documentElement.scrollWidth + "px";
bgObj.style.height = document.documentElement.scrollHeight + "px";
tsObj.setAttribute("id","tips_b");
document.body.appendChild(tsObj);
tsObj.style.position = "absolute";
tsObj.style.zIndex = "9999";
tsObj.style.background = "#fff";
tsObj.style.border = "1px solid " + mainColor;
tsObj.style.textAlign = "center";
document.getElementById("tips_b").appendChild(strObj);
strObj.style.padding = "15px 30px";
strObj.style.font = "12px 宋体";
strObj.style.lineHeight = "21px";
strObj.innerHTML = '<div>正在进行后台操作，请耐心等待……</div>
<img border="0" src="http://www.livingelsewhere/images/p4p_loading.gif" />';
//定位提示层top/left
tsObj.style.top = document.documentElement.scrollTop + (document.documentElement.clientHeight -
tsObj.clientHeight)/2 + "px";
tsObj.style.left = (document.documentElement.clientWidth - tsObj.clientWidth)/2 + "px";
}
//删除提示层
function hideloading(){
$("#tips_b").remove();
$("#tips_a").remove();
}
[/js]

调用：
[js]
$(window).ajaxStart(function(){
showloading();
});
$(window).ajaxStop(function(){
hideloading();
[/js]