1.jquery方式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ajax加载loading图标</title>
</head>
<body>
<form ></html>
2.js方式
xmlhttp.onreadystatechange = function(){
var loadingdiv = document.getelementbyid("loading");
loadingdiv.innerhtml = "loading...";
loadingdiv.style.right = "0";
loadingdiv.style.top = "0";
loadingdiv.style.display = "block";
//load completed
if(xmlhttp.readystate == 4) {
loadingdiv.style.display = "none";
loadingdiv.innerhtml = "";
if(xmlhttp.status == 200) {
var str = xmlhttp.responsetext;
/* do something here ! */
}
else
alert("error!" + "nstatus code is: " + xmlhttp.status + "nstatus text is: " + xmlhttp.statustext);
}
}
function toAjax(url,data,type,callback) {
var i;
$.ajax({
url:url,
type:type,
data:data,
dataType:"json",
error:function(){
alert("错误!");
},
beforeSend: function () {
i = before();
},
success:function(result) {
Load(i);
callback && callback(result);
}
});
}
function before(){
return layer.msg('加载中...', {icon: 16,shade: [0.5, '#f5f5f5'],scrollbar: false,offset: '0px', time:100000}) ;
}
function Load(index){
layer.close(index);
}
用了layer的loading 推荐layer，弹窗，样式还不错!!!