ajax 異步加載顯示等待效果


css:

#loading {
width:170px;
height:25px;
border:3px solid #C3DAF9;
position:absolute;
top:300px;
left:600px;
z-index:10000;
background-color:#F7F9FC;
line-height:25px;
vertical-align:middle;
font-size:11pt;
display:none;
}

 

html:

<div id="loading"><img src="${path}/map/image/2012032811155512.gif" alt=""/>正在加載數據,請稍候...</div>

js:

$.ajax({
async: true,
beforeSend: function () {
    ShowDiv();
},
complete: function () {
    HiddenDiv();
},
type : 'POST' ,
url : '',
data : {

},
success: function (data) {
//var obj = JSON.parse(data);
//var str = JSON.stringify(obj);



}
});

 

//顯示加載數據
function ShowDiv() {
$("#loading").show();
}

//隱藏加載數據
function HiddenDiv() {
$("#loading").hide();
}

圖片:

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM