转载:JS进度条
转载地址:http://blog.csdn.net/treeClimber/article/details/569974
代码在原基础上稍作改动,如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title> New Document </title> <meta name="Generator" content="EditPlus"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> </head> <body> <table align="center" width="90%"> <tr><td><div id="load_text">正在导入数据,已完成 <span id="load_percent" class="load_percent">0</span>,请稍候....</div></td></tr> <tr><td> <div id="load_progress" style="background-color:#6666ff;width:00%;height:18px"></div><BR> <div id="progress1" style="color:#6666ff;font-family:Arial;font-weight:bold;height:18px">|</div><BR> </td></tr> </table> <style> .load_percent{ font-family:宋体; font-style:oblique; font-weight:bold; color:#6666FF; } </style> <script language="javascript"> var already = 0; function display(max){ already++; var dispObj = document.all.load_progress; dispObj.style.width = 100.0*already/max+"%"; document.all.load_percent.innerHTML = 100.0*already/max+"%"; dispObj.innerHTML = "<span style='color:#FFFFFF;font-family:宋体;font-style:oblique'>"+100.0*already/max+"%</span>"; document.all.progress1.innerHTML += "|"; var timer = window.setTimeout("display("+max+")",200); if (already >= max){ window.clearTimeout(timer); document.all.load_text.innerHTML = "已完成。"; } } display(50); </script> </body> </html>