在页面加载完毕前显示等待提示

通常在显示大量内容的网页时,由于页面内容比较大下载速度慢,若能给用户有个等待提示那岂不是快哉。
在这里我分析一个案例,使用的javascript脚本在客户端显示等待提示。
首先介绍window.onload函数:
在整个页面文档在下载完成之后才触发该动作;在文档下载之前,该函数对象为空的。(本人理解)
下面我们看看代码,之前id='doing' 的层为显示状态,将遮盖了页面的整个区域,下载完成后触发隐藏id='doing' 的层的函数,如此就实现了等待提示。

< div  id ='doing'  style ='Z-INDEX:  12000; LEFT: 0px; WIDTH: 100%; CURSOR: wait; POSITION: absolute; TOP: 0px; HEIGHT: 100%' >
< table  width ='100%'  height ='100%'  id ="Table1" >
< tr  align ='center'  valign ='middle' >
< td  >
< table   id ="Table2"  class ="loading" >
    
< tr >
        
< td  style ="text-align: center" >
            
  td >
    
tr >
    
< tr >
        
< td  style ="text-align: center" >
            
  td >
    
tr >
    
< tr >
        
< td  style ="text-align: center" >
            
  td >
    
tr >
    
< tr >
        
< td  style ="text-align: center" >
            
  td >
    
tr >
    
< tr >
        
< td  style ="text-align: center" >
            感谢您的使用
td >
    
tr >
    
< tr >
    
< td >
        
< img  src ="Images/process.gif"   /> td >
    
tr >
    
< tr  align ='center'  valign ='middle' >
    
< td > 正在加载页面,请等待... td >
    
tr >
table >
td >
tr >
table >
div >
< script  language ="javascript" >
function ShowWaiting()
{
document.getElementById(
'doing').style.visibility = 'visible';
}

function CloseWaiting()
{
document.getElementById(
'doing').style.visibility = 'hidden';
}

function MyOnload()
{
document.getElementById(
'doing').style.visibility = 'hidden';
}

if (window.onload == null)
{
window.onload 
= MyOnload;
}

script >

你可能感兴趣的:(在页面加载完毕前显示等待提示)