进度条实现---各种方式

方法一（用两部分js完成）：

<script language=javascript>
   
 for(i=0;i<300;i++)
  document.write("<input class=proccess >")
    
    document.write("<div align=center style='font-size:12pt;color:#660000;'>请稍等……后台正在运行!</div>")
 </script>

-------------

<script language=JavaScript>
 var p=0,j=0;
 var c=new Array("#FF6600","#ffffff")
 setInterval('proccess();',300)
 function proccess(){
  document.forms.proccess.elements[p].style.background=c[j];
  p+=1;
  if(p==300){p=0;j=1-j;}}
</script>

====================

方法二：

var i=0;//全局变量
var n=0;//全局变量
var min = '1'; //进度速度  全局标量
function loading() {
  var url='adminLogin.do?operation=login'; //转

  var l='320'; //总长度 该了 div 也要改
  var t='40'; //进度条长度
  var h='20'; //进度条高度度
  if(i<l) {
   if(i>=l-t) {
    i<l ? i++ : i=1; n=l-i;
    } else {
     if(n>t) i<l ? i++ : i=1;
     else n++;
     }
   } else {
    i=0; n=0; location.href=url
    }
     document.getElementById('loading').innerHTML='<div style="BACKGROUND: #A0E000; MARGIN-LEFT: '+i+'px; WIDTH: '+n+'px; HEIGHT: ' + h + 'px; OVERFLOW: hidden;"/>';

  }
 function debug() {
  var debug='<div style=" WIDTH: 100%; HEIGHT: '+document.body.clientHeight+'px; FILTER: alpha(opacity=75);"></div>'+
  '<div class="debug" style="position:absolute; TOP: '+((document.body.clientHeight/2)-32)+'px; LEFT: '+((document.body.clientWidth/2)-180)+'px;">'+
  '<div style="PADDING: 10px; FONT-WEIGHT: bold;">Loading..</div>'+
  '<div id="loading" style="BACKGROUND: #EEEEEE; WIDTH: 320px; PADDING: 1px; BORDER: #AAAAAA 1px solid; TEXT-ALIGN: left;"></div>'+
  '<div style="PADDING: 12px; TEXT-ALIGN: right;">正在登录系统,请不要刷新,请稍候..</div>'+
  '</div>';
  setInterval( 'loading()', min );
  document.getElementById('debug').innerHTML = debug;
 }