JSP 页面保存或者提交数据时,弹出浮层防止用户在保存过程中进行其他操作

来源:互联网 发布:linux gcc默认path 编辑:程序博客网 时间:2024/05/12 19:42

现在做的页面,字段挺多,而且有上传文件,用的是struts2的file上传,一切就绪之后,就submit表单,上传数据

当然 关键代码

<s:form name="frmMain" theme="simple"  method="POST" enctype="multipart/form-data"> 

JS代码

document.forms[0].action = InsertCpApp.do;

document.forms[0].submit();


这样 由于数据和网络的问题,可能要等好几秒才会完全提交并跳转页面,这个过程中用户不知道在干什么,所以弹出个浮层,防止其重复提交和有其他操作

核心代码如下

<div id="hidden_div" style="left:0;top:0;margin-left:100px;margin-top:100px;
position:absolute;opacity:0.9;z-index:99;display:none;">
 <img id="logo" src="resources/images/wait.gif" alt="" />
</div> 
<div id="mask" style="position:fixed;top:0;left:0;right:0;bottom:0;
background-color:#000;opacity:0.2;z-index:98;display:none;"></div> 

两个div初始都是隐藏的,一个是提醒等待的图片,类似进度条的gif,下面的是个跟原页面大小一致的浮层,盖住原来的页面,透明度0.2

当提交的时候 在submit之前

//弹出层
document.getElementById("hidden_div").style.display = "block";
document.getElementById("mask").style.display = "block";

让这两个div显示出来。。mask盖一层,最上面是hidden_div的一层图片~~  等submit结束 页面跳转~

0 0
原创粉丝点击