本文主要是介绍Java,Jsp点击事件后,出现等沙漏,处理等待状态时,有提示在动,适合任何事件使用,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
第一步:在jsp页面里写个函数
<script type="text/javascript">
function XXX(){
--方法调用完后,添加上下面的函数,如果等待时间不是特别的短,就会出现,一个图标的状态.
displayMessage();
}
function displayMessage(){
if(navigator.userAgent.indexOf("Firefox")==-1){
var obj = document.getElementsByTagName('SELECT');
for(var i=0;i<obj.length;i++){
if(obj[i].type.indexOf("select")!=-1)
obj[i].style.visibility = 'hidden';
}
mask.style.visibility = 'visible';
massage_box.style.visibility = 'visible';
}
}
</script>
第二步,给出现的等待状态窗体加样式
<style type="text/css">
#massage_box{ position:absolute; left:expression((body.clientWidth-350)/2); top:expression(body.scrollTop+(body.clientHeight-this.offsetHeight)/2); width:350px; height:130px;filter:dropshadow(color=#666666,offx=3,offy=3,positive=2); z-index:2; visibility:hidden}
#mask{ position:absolute; top:0; left:0; width:expression(body.clientWidth); height:expression(body.scrollHeight>body.clientHeight?body.scrollHeight:body.clientHeight); background:#666; filter:ALPHA(opacity=60); z-index:1; visibility:hidden}
.massage{border:#036 solid; border-width:1 1 3 1; width:95%; height:95%; background:#fff; color:#036; font-size:12px; line-height:150%}
.header{background:#554295; height:10%; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; padding:3 5 0 5; color:#fff}
</style>
第三步:在<body></body>标签下面添加如下代码.
<div id="massage_box">
<div class="massage">
<div class="header" οnmοusedοwn="MDown(massage_box);">
<div style="display:inline; width:150px; position:absolute">System Information</div>
<span onClick="massage_box.style.visibility='hidden'; mask.style.visibility='hidden'" style="float:right; display:inline; cursor:hand">×</span>
</div>
<div style="margin-top:30px;margin-left:30px">
<img src="<%=request.getContextPath()%>/images/loading.gif" align="absmiddle" /> Please wait...
</div>
</div>
</div>
<div id="mask">
</div>
下面我添加一个运行出来的效果图.
如果大家有更好的方法,可以互相交流下,希望上面这个例子,能帮到你.
这篇关于Java,Jsp点击事件后,出现等沙漏,处理等待状态时,有提示在动,适合任何事件使用的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!