陈市明
摘自:http://www.blogjava.net/JPeanut
呵呵,无意中翻到2年前写的一段JS,感觉还是比较有用
好早的代码了,那个时候我还喜欢用YoungSnow的名字呢
<script>


var loadbar = new Ys_LoadBar(4000,"请稍后,系统正在处理……<br><预计进度显示>","合同数据保存中……");
loadbar.loadExecute();


/** *//**
* 作者: YoungSnow
* 作用:显示load bar ,禁止左右表单输入
* 用法:
* var loarbar = new Ys_LoadBar(4000,"请稍后,系统正在处理……<br><预计进度显示>","合同数据保存中……");
* loarbar.loadExecute();
* param:
* totalTime:进度条的时间
* strTip:上面的提示字符
* strWait:进度条结束后下面跳动的字符
* public function:
* loadExecute()
*/

function Ys_LoadBar(totalTime,strTip,strWait)
{
//private properties
var loadTotalTime = 0; //进度条的时间
var loadMaxChar = 0; //进度条的字符数目
var loadPerTimeChar = 0; //setTimeOut's interval
var loadstrTip = 0; //上面的提示字符
var loadstrWait = 0; //进度条结束后下面跳动的字符
this.loadTotalTime = totalTime;
this.loadstrTip = strTip;
this.loadstrWait = strWait;
//private funcitons
this.loadInit = loadInit;
this.loadExecute = loadExecute;
this.loadWork = loadWork;
this.loadStop = loadStop;
this.loadWaitChange = loadWaitChange;
this.loadDisplayDiv = loadDisplayDiv;
this.loadDisabledAllForm = loadDisabledAllForm;

//进行一些必要的初始化
this.loadInit();
}


/** *//**
* 开始运行
*/

function loadExecute()
{
loadFrame.style.visibility = "visible";
this.loadWork();
}


/** *//**
* 初始化
*/

function loadInit()
{
this.loadDisplayDiv();
this.loadMaxChar = 100;
this.loadPerTimeChar = this.loadTotalTime/this.loadMaxChar;
this.loadDisabledAllForm();
}


/** *//**
* 进度条显示
*/

function loadWork()
{
loadBar.value += "■";
loadNum.value = (parseInt(loadNum.value.replace("%",""))+1)+"%";

if(parseInt(loadNum.value)>99)
{
loadStop();
return ;
}
setTimeout("this.loadWork()",this.loadPerTimeChar);
}


/** *//**
* 进度条停止
*/

function loadStop()
{
loadNum.style.display = "none";
loadWaitChange();
}


/** *//**
* 字幕跳动
*/

function loadWaitChange()
{
if(loadWait.style.visibility=="visible")
loadWait.style.visibility = "hidden";
else
loadWait.style.visibility = "visible";
setTimeout("this.loadWaitChange()",300);
}


/** *//**
* 显示div图层
*/

function loadDisplayDiv()
{
document.write("<div id='loadFrame' style='position:absolute; left:20;bottom:330; z-index:10; visibility:hidden'>");
document.write(" <table width=100% border=0 cellspacing=0 cellpadding=0>");
document.write(" <tr>");
document.write(" <td align='center'>");
document.write(" <table border=2 cellspacing=0 cellpadding=0 bordercolor='#ff9900' width='400' height=151>");
document.write(" <tr>");
document.write(" <td>");
document.write(" <table border=0 width='100%' bgcolor=#eeeeee height=150>");
document.write(" <tr>");
document.write(" <td height='3'></td>");
document.write(" </tr>");
document.write(" <tr>");
document.write(" <td align='center'><font style='font-size: 12px; margin-top:0px;color:#66CC33'>"+this.loadstrTip+"</font></td>");
document.write(" </tr>");
document.write(" <tr>");
document.write(" <td height='3'></td>");
document.write(" </tr>");
document.write(" <tr>");
document.write(" <td align='left'><input type='text' name='loadBar' size='200' style='border:none;background-color:#eeeeee;font-size:4px'>");
document.write(" </tr>");
document.write(" <tr>");
document.write(" <td align='center'>");
document.write(" <input type='text' name='loadNum' size=3 value='0%' style='border:none;background-color:#eeeeee'> ");
document.write(" <div id='loadWait' style='visibility:hidden'> <font style='font-size: 12px; margin-top:0px;color:#66CC33'> "+this.loadstrWait+" </font></div> ");
document.write(" </td>");
document.write(" </tr>");
document.write(" <tr>");
document.write(" <td height='3'></td>");
document.write(" </tr>");
document.write(" </table>");
document.write(" </td>");
document.write(" </tr>");
document.write(" </table>");
document.write(" </td>");
document.write(" </tr>");
document.write(" </table>");
document.write("</div>");
}


/** *//**
* 禁止所有表单
*/

function loadDisabledAllForm()
{

for(i=0;i<document.forms.length;i++)
{

for(j=0;j<document.forms[i].length;j++)
{
document.forms[i].elements[j].disabled = true;
}
}
}
</script>
