进度条的实现可以通过下面的javascript实现: <table align="center"><tr><td> <div style="font-size:8pt;padding:2px;border:solid black 1px"> <span id="progress1"> </span> <span id="progress2"> </span> <span id="progress3"> </span> <span id="progress4"> </span> <span id="progress5"> </span> <span id="progress6"> </span> <span id="progress7"> </span> <span id="progress8"> </span> <span id="progress9"> </span> </div> </td></tr></table> <script language="javascript"> var progressEnd = 9; // set to number of progress <span>'s. var progressColor = 'blue'; // set to progress bar color var progressInterval = 1000; // set to time between updates (milli-seconds)
var progressAt = progressEnd; var progressTimer; function progress_clear() { for (var i = 1; i <= progressEnd; i++) document.getElementById('progress'+i).style.backgroundColor = 'transparent'; progressAt = 0; } function progress_update() { progressAt++; if (progressAt > progressEnd) progress_clear(); else document.getElementById('progress'+progressAt).style.backgroundColor = progressColor; progressTimer = setTimeout('progress_update()',progressInterval); } function progress_stop() { clearTimeout(progressTimer); progress_clear(); } progress_update(); // start progress bar </script> 实现的原理就是通过修改spanid的backgroundColor 值和setTimeout('progress_update()',progressInterval); 定时器函数来实现的。 
|