您的位置:首页 > 其它

重复提交,加遮罩层

2016-04-14 11:15 351 查看
function ajaxLoading(msg,msgMaginTop){
//信息提示
var default_msg = '正在处理,请稍后。。。';
//信息布局位置向上内边距
var default_msgMaginTop= -45;
var _msg = '';
var _msgMaginTop=0;
// 判断参数
if (msg == 'undefined') {
_msg = default_msg;
} else {
_msg = msg;
}
if (msgMaginTop == 'undefined') {
_msgMaginTop = default_msgMaginTop;
} else {
_msgMaginTop = msgMaginTop;
}
//$("<div class=\"datagrid-mask\"></div>").css({display:"block",width:"100%",height:$(window).height()}).appendTo("body");
$("<div class=\"datagrid-mask\"></div>").css({display:"block",width:"100%",height:document.body.offsetHeight}).appendTo("body");
$("<div class=\"datagrid-mask-msg\"></div>").html(_msg).appendTo("body").css({display:"block",left:($(document.body).outerWidth(true) - 190) / 2,top:(document.body.offsetHeight + _msgMaginTop) / 2});
}

function ajaxLoadEnd(){
$(".datagrid-mask").remove();
$(".datagrid-mask-msg").remove();
}

css:

.datagrid-mask {
position: absolute;
left: 0;
top: 0;
background: #ccc;
opacity: 0.3;
filter: alpha(opacity=30);
display: none;
}

.datagrid-mask-msg {
position: absolute;
left: 100px;
top: 50px;
width: auto;
height: 16px;
padding: 12px 5px 10px 30px;
background: #fff url('images/pagination_loading.gif') no-repeat scroll 5px 10px;
border: 2px solid #ccc;
color: #222;
display: none;
}


使用示例:

ajaxLoading();
$('#myform').form('submit',{
url:"vehAlarmHandleCtrl.do?method=setHandle",
onSubmit: function(){
return $(this).form('validate');
}	,
success: function(data){
ajaxLoadEnd();
returns(data);
}
});


效果:

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: