<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>登录</title>
<style type="text/css">
/*加载css*/
.background {
display: block;
width: 100%;
height: 100%;
opacity: 0.4;
filter: alpha(opacity=40);
background:while;
position: absolute;
top: 0;
left: 0;
z-index: 2000;
}
.progressBar {
border: solid 2px #86A5AD;
background: white url(image/img.gif) no-repeat 10px 20px;
background-size:28px;
}
.progressBar {
display: block;
width: 160px;
height:50px;
position: fixed;
top: 50%;
left: 50%;
margin-left: -74px;
margin-top: -14px;
padding: 10px 10px 10px 50px;
text-align: left;
line-height: 50px;
font-weight: bold;
position: absolute;
z-index: 2001;
}
/*提示图片*/
#successImg{
width: 58px;
height: 58px;
margin: 0px auto;
background: url("image/warning.png") no-repeat ;
border:none;
}
</style>
</head>
<body>
/*加载html*/
<div class="login_cont">
<div id="background" class="background" style="display: none; "></div>
<div id="progressBar" class="progressBar" style="display: none; ">登录中，请稍等...</div>
</div>
<script src="js/jquery.min.js"></script>
<script>
jQuery.extend({
alertWindow:function(e,n){var e=e,r;n===undefined?r="#00a8b7":r=n;
if($("body").find(".alertWindow1").length===0){
var i='<div class="alertWindow1" style="width: 100%;height: 100%; background:rgba(0,0,0,0.5);position: fixed; left:0px; top: 0px; z-index: 9999;"><div style="width: 360px; height: 170px;background: #FFF;margin: 300px auto;border: 2px solid #CFCFCF;">'+'<div style="width: inherit;height: 20px;">'+'<div class="alertWindowCloseButton1" style="float: right; width: 10px; height: 30px;margin-right:5px;font-family:\'microsoft yahei\';color:'+r+';cursor: pointer;"></div>'+"</div>"+'<div id="successImg" class="alertWindowTitle" style="margin-top:10px;text-align:center;font-family:\'Verdana, Geneva, Arial, Helvetica, sans-serif\';font-size: 18px;font-weight: normal;color: '+r+';">'+"</div>"+'<div class="alertWindowContent" style="width:360px;height: 40px;text-align:center;font-size: 18px;color: #7F7F7F;margin-top:10px;">'+e+"</div>"+"</div>"+"</div>";
$("body").append(i);
var s=$(".alertWindow1");
setTimeout(function(){s.hide()},2000);
}else {
$(".alertWindowContent").text(e),$(".alertWindow1").show(),setTimeout(function(){$(".alertWindow1").hide()},1000);}
}
});
function login() {
/*加载框*/
var ajaxbg = $("#background,#progressBar");
$.ajax({
type:"POST",
dataType:"json",
url:"",
data:“”,
beforeSend:function(){
/*加载框显示*/
ajaxbg.show();
},
success:function(result) {
if(result.status == 100){
}else{
ajaxbg.hide();//接口完成后加载框关闭
jQuery.alertWindow(result.msg);//提示
}
}
});
}
</script>
</body>
</html>
