loading.gif
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<style type="text/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;
}
</style>
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
//Init();
});
function Init() {
$("#loading").show();
setTimeout(HiddenDiv,5000);
}
function ShowDiv() {
$("#loading").show();
}
function HiddenDiv() {
$("#loading").hide();
}
function OnclickTest() {
$.ajax({
async: true,
beforeSend: function () {
ShowDiv();
},
complete: function () {
HiddenDiv();
},
url: "ajax/Handler1.ashx",
success: function (data) {
alert("执行成功");
}
});
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div id="loading" ><img src="Images/loading.gif" alt="" /> 正在加载数据,请稍候...</div>
<input type="button" id="btn" value="测试" onclick="OnclickTest()" />
</div>
</form>
</body>
</html>
