asp.net 进度条实现。。
实现的是一个假的进度条,就是一直在转,不用的时候可以隐藏掉就行;
代码:
<style type ="text/css"> .loading{ border:1px solid #000000; width:200px; background:#ECF2FF; margin-right:auto; margin-left:auto; } .loading div{ float:left; font-size:1px; border:1px solid #ECF2FF; background:#6699CC; width:10px; height:12px; } </style> <div id="load" runat="server" > <table> <tr id="trLoad"> <td nowrap align="center" style="color: Red; font-size: 12px; color: red" colspan="2"> 正在上传文件中,请稍候…… <br /> <marquee class="loading" direction="right" scrollamount="5" scrolldelay="10"> <div></div><div></div><div></div><div></div><div></div><div></div></marquee> </td> </tr> </table> </div>
图片效果:
应用: 导入成功后滚动条会自动隐藏
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <style type ="text/css"> .loading{ border:1px solid #000000; width:200px; background:#ECF2FF; margin-right:auto; margin-left:auto; } .loading div{ float:left; font-size:1px; border:1px solid #ECF2FF; background:#6699CC; width:10px; height:12px; } </style> <script type="text/javascript"> function isimport() { if (confirm("如存在重复数据,系统将会覆盖原数据,是否确定导入?")) { document.getElementById("load").style.display = "block"; return true; } else { return false; } } </script> </head> <body> <form id="form1" runat="server"> <asp:FileUpload ID="GetUploadFileContent" runat="server" /> <asp:Button ID="btnUpload" runat="server" Text="导入" OnClick="btnUpload_Click" OnClientClick=" return isimport()"></asp:Button> <div id="load" runat="server" style=" display:none;" > <table> <tr id="trLoad"> <td nowrap align="center" style="color: Red; font-size: 12px; color: red" colspan="2"> 数据正在导入中,请稍候…… <br /> <marquee class="loading" direction="right" scrollamount="5" scrolldelay="10"> <div></div><div></div><div></div><div></div><div></div><div></div></marquee> </td> </tr> </table> </div> <div></div> <div> <asp:TextBox runat="server" ID="ee" TextMode="MultiLine" Width="600px" Height="500px" BorderStyle="None"></asp:TextBox> </div> </form> </body> </html>