Asp.net做了个文件上传的功能,但是稍微大点的文件会造成页面的假死状态,所以想做个进度条或者图片闪烁告诉用户正在上传中,希望高手给个实例我看看,不胜感激!

解决方案 »

  1.   

    用ajax写吧...具体的我没写过.
      

  2.   

    最简单的想用个div+gif来显示,但是这个也不懂,也不会写 有例子否?
      

  3.   

    swfupload asp.nethttp://www.codefans.net/soft/7914.shtml
      

  4.   

    简单的就是DIV+GIF向这样    <div id="loading" style="position:absolute;width:100%;height:100%; 
    left:0px;top:0px;background-color:#ffffff;filter:alpha 
    (opacity=95);display:none;">
        <div style="text-align:center;padding-top:200px"> 
    数据预计需要3到5分钟的加载时间,请勿关闭窗口及刷新页面,请稍后........
    <br />
    <br />
    <img src="../images/waitting.gif" />
        </div>
        </div>
    上面那段代码要放在<body>标记下面,也就是等加载页面的时候。
      

  5.   

    function divstyle()
        {
            document.getElementById("loading").style.display = 'block';
        }
    少了一个JS,
      

  6.   

    http://swfupload.org/sites/swfupload.org/files/swfupload_vr5.2.applicationdemo.asp.net.2.0.zip
      

  7.   

    刚好看了一篇帖子,上传带进度条的
    http://topic.csdn.net/u/20100228/19/e7f49404-9e81-461a-8be1-e7040778a802.html?10858
      

  8.   

    前台:
     <script type="text/javascript">
            var xmlHttp;
            
            function upload()
            {
                var imgload=document.getElementById("file").value;
                xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
                xmlHttp.onreadystatechange=call;
                xmlHttp.open("get","FileUpload.aspx?file="+encodeURIComponent(imgload),true);    
                xmlHttp.send();
            }
            
            function call()
            {
                if(xmlHttp.readyState == 4&&xmlHttp.status==200) {
                    if(xmlHttp.responseText=="OK")
                    {
                          document.getElementById("img").src="";
                    }
                }
            }
            
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
            <input id="file" type="file" />
            <input id="btnUp" type="button" value="上传" onclick="upload();" />
            <img id="img" src="image/arrow.gif" />
        </div>
        </form>
    </body>后台:
    if (Request["file"] != null)
                    {
                        string imgload = Request["file"];
                        string fileName = imgload.Substring(imgload.LastIndexOf('\\')+1);
                        string fileStream = Server.MapPath("~/image/"+fileName);
                        WebClient myWebClient = new WebClient();
                        myWebClient.Credentials = CredentialCache.DefaultCredentials;
                        FileStream fs = new FileStream(Request["file"], FileMode.Open, FileAccess.Read);
                        BinaryReader r = new BinaryReader(fs);
                        myWebClient.UploadFile(fileStream, Request["file"]);
                        Response.Write("OK");
                        Response.Flush();
                        Response.End();
                    }写的不好,不要见笑
      

  9.   

    弄一个DIV 假的就可以啦,
    看看行不
      

  10.   

    default.aspx<%@ Page Language="C#" %>
    <%@ Register Assembly="MattBerseth.WebControls.AJAX" Namespace="MattBerseth.WebControls.AJAX.Progress" TagPrefix="mb" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>Untitled Page</title>
        <link rel="Stylesheet" href="_assets/css/progress.css" />
        <link rel="Stylesheet" href="_assets/css/upload.css" />
        <style type="text/css">
            BODY{ font-family:Arial, Sans-Serif; font-size:12px;}
        </style>
        <script type="text/C#" runat="server">
           
            protected void Page_Load(object sender, EventArgs args)
            {
                if (!this.IsPostBack)
                {                
                    this.Session["UploadInfo"] = new UploadInfo { IsReady = false };
                }
            }
            
            /// <summary>
            /// 
            /// </summary>
            [System.Web.Services.WebMethod]
            [System.Web.Script.Services.ScriptMethod]
            public static object GetUploadStatus()
            {
                //获取文件长度
                UploadInfo info = HttpContext.Current.Session["UploadInfo"] as UploadInfo;            if (info != null && info.IsReady)
                {
                    int soFar = info.UploadedLength;
                    int total = info.ContentLength;                int percentComplete = (int)Math.Ceiling((double)soFar / (double)total * 100);
                    string message = string.Format("上传 {0} ... {1} of {2} 字节", info.FileName, soFar, total);
                    
                    //  返回百分比
                    return new { percentComplete = percentComplete, message = message };
                }            //  还没有准备好...
                return null;
            }
        
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <asp:ScriptManager ID="scriptManager" runat="server" EnablePageMethods="true" />
        
        <script type="text/javascript">
            var intervalID = 0;
            var progressBar;
            var fileUpload;
            var form;       
            // 进度条      
            function pageLoad(){           
                $addHandler($get('upload'), 'click', onUploadClick);
                progressBar = $find('progress');
            }
            // 注册表单       
            function register(form, fileUpload){            
                this.form = form;
                this.fileUpload = fileUpload;
            }        
            //上传验证
            function onUploadClick() {        
                var vaild = fileUpload.value.length > 0;
                if(vaild){              
                    $get('upload').disabled = 'disabled';             
                    updateMessage('info', '初始化上传...');                
                    //提交上传
                    form.submit();                
                    // 隐藏frame
                    Sys.UI.DomElement.addCssClass($get('uploadFrame'), 'hidden');
                    // 0开始显示进度条
                    progressBar.set_percentage(0);
                    progressBar.show();           
                    // 上传过程
                    intervalID = window.setInterval(function(){
                        PageMethods.GetUploadStatus(function(result){
                            if(result){
                                //  更新进度条为新值
                                progressBar.set_percentage(result.percentComplete);
                                //更新信息
                                updateMessage('info', result.message);
                                
                                if(result == 100){
                                    // 自动消失
                                    window.clearInterval(intervalID);                        
                                }
                            }
                        });
                    }, 500);                
                }
                else{
                    onComplete('error', '您必需选择一个文件');
                }
            }       
        
            function onComplete(type, msg){
                // 自动消失
                window.clearInterval(intervalID);
                // 显示消息
                updateMessage(type, msg);
                // 隐藏进度条
                progressBar.hide();
                progressBar.set_percentage(0);
                // 重新启用按钮
                $get('upload').disabled = '';
                //  显示frame
                Sys.UI.DomElement.removeCssClass($get('uploadFrame'), 'hidden');
            }        
            function updateMessage(type, value){
                var status = $get('status');
                status.innerHTML = value;
                // 移除样式
                status.className = '';
                Sys.UI.DomElement.addCssClass(status, type);
            }
        
        </script>
        
        <div>
            <div class="upload">
                <h3>文件上传</h3>
                <div>
                    <iframe id="uploadFrame" frameborder="0" scrolling="no" src="Upload.aspx"></iframe>
                    <mb:ProgressControl ID="progress" runat="server" CssClass="lightblue" style="display:none" Value="0" Mode="Manual" Speed=".4" Width="100%" />
                    <div>
                        <div id="status" class="info">请选择要上传的文件</div>
                        <div class="commands">
                            <input id="upload" type="button" value="上传" /> 
                        </div>
                    </div>
                </div>
            </div> 
          
        </div>
        </form>
    </body>
    </html>
      

  11.   

    upload.aspx<%@ Page Language="C#" EnableSessionState="ReadOnly" Async="true" %>
    <%@ Import Namespace="System.IO"  %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>Untitled Page</title>
        <script runat="server">
            //限制大小 1M
            protected void Page_Load2(object sender, EventArgs e)
            {
                if (this.IsPostBack)
                {
                    UploadInfo uploadInfo = this.Session["UploadInfo"] as UploadInfo;
                    if (uploadInfo == null)
                    {
                        // 让父页面知道无法处理上传
                        const string js = "window.parent.onComplete('error', '无法上传文件。请刷新页面,然后再试一次);";
                        ScriptManager.RegisterStartupScript(this, typeof(upload_aspx), "progress", js, true);
                    }
                    else
                    {
                        //  让服务端知道我们还没有准备好..
                        uploadInfo.IsReady = false;                    //  上传验证
                        if (this.fileUpload.PostedFile != null && this.fileUpload.PostedFile.ContentLength > 0                        && this.fileUpload.PostedFile.ContentLength < 1048576)//  限制1M
                        {
                            //  设置路径
                            string path = this.Server.MapPath(@"Uploads");
                            string fileName = Path.GetFileName(this.fileUpload.PostedFile.FileName);                        // 上传信息
                            uploadInfo.ContentLength = this.fileUpload.PostedFile.ContentLength;
                            uploadInfo.FileName = fileName;
                            uploadInfo.UploadedLength = 0;                       //文件存在 初始化...
                            uploadInfo.IsReady = true;                       //缓存
                            int bufferSize = 1;
                            byte[] buffer = new byte[bufferSize];                        // 保存字节
                            using (FileStream fs = new FileStream(Path.Combine(path, fileName), FileMode.Create))
                            {                         
                                while (uploadInfo.UploadedLength < uploadInfo.ContentLength)
                                {
                                   //从输入流放进缓冲区
                                    int bytes = this.fileUpload.PostedFile.InputStream.Read(buffer, 0, bufferSize);
                                    // 字节写入文件流
                                    fs.Write(buffer, 0, bytes);
                                    //  更新大小
                                    uploadInfo.UploadedLength += bytes;                                //  线程睡眠 上传就更慢 这样就可以看到进度条了
                                    System.Threading.Thread.Sleep(100);
                                }
                            }                        // 删除.
                            File.Delete(Path.Combine(path, fileName));                        //   让父页面知道已经处理上传完毕
                            const string js = "window.parent.onComplete('success', '{0} 已成功上传');";
                            ScriptManager.RegisterStartupScript(this, typeof(upload_aspx), "progress", string.Format(js, fileName), true);
                        }
                        else
                        {
                            if (this.fileUpload.PostedFile.ContentLength >= 1048576)//1M
                            {
                                const string js = "window.parent.onComplete('error', '超出上传文件限制大小,请重新选择');";
                                ScriptManager.RegisterStartupScript(this, typeof(upload_aspx), "progress", js, true);
                            }
                            else
                            {
                                const string js = "window.parent.onComplete('error', '上传文件出错');";
                                ScriptManager.RegisterStartupScript(this, typeof(upload_aspx), "progress", js, true);
                            }
                        }                  
                        uploadInfo.IsReady = false;
                    }
                }        
            }        // 不限制大小
            protected void Page_Load(object sender, EventArgs e)
            {
                if (this.IsPostBack)
                {
                    UploadInfo uploadInfo = this.Session["UploadInfo"] as UploadInfo;             
                    uploadInfo.IsReady = false;               
                    if (this.fileUpload.PostedFile != null && this.fileUpload.PostedFile.ContentLength > 0)
                    {               
                        string path = this.Server.MapPath(@"Uploads");
                        string fileName = Path.GetFileName(this.fileUpload.PostedFile.FileName);
                       
                        uploadInfo.ContentLength = this.fileUpload.PostedFile.ContentLength;
                        uploadInfo.FileName = fileName;
                        uploadInfo.UploadedLength = 0;
                        
                        uploadInfo.IsReady = true;                    int bufferSize = 1;
                        byte[] buffer = new byte[bufferSize];                    using (FileStream fs = new FileStream(Path.Combine(path, fileName), FileMode.Create))
                        {
                            while (uploadInfo.UploadedLength < uploadInfo.ContentLength)
                            {
                                int bytes = this.fileUpload.PostedFile.InputStream.Read(buffer, 0, bufferSize);                          
                                fs.Write(buffer, 0, bytes);                         
                                uploadInfo.UploadedLength += bytes;
                            }
                        }
                        const string js = "window.parent.onComplete('success', '{0} 已成功上传');";
                        ScriptManager.RegisterStartupScript(this, typeof(upload_aspx), "progress", string.Format(js, fileName), true);
                    }
                    else
                    {
                        const string js = "window.parent.onComplete('error', '上传文件出错');";
                        ScriptManager.RegisterStartupScript(this, typeof(upload_aspx), "progress", js, true);
                    }
                    uploadInfo.IsReady = false;
                }
            }        
        </script>
        <style type="text/css">
            BODY{margin:0; padding:0; background-color:#F0F8FF;}
        </style>
    </head>
    <body>
        <form id="form" runat="server" enctype="multipart/form-data">
        <asp:ScriptManager ID="scriptManager" runat="server" />
        <script type="text/javascript">
            function pageLoad(sender, args){               
                window.parent.register(
                    $get('<%= this.form.ClientID %>'), 
                    $get('<%= this.fileUpload.ClientID %>')
                );
            }
        </script>
        <div>
            <asp:FileUpload ID="fileUpload" runat="server" Width="100%" />
        </div>
        </form>
    </body>
    </html>
      

  12.   

    this.fileUpload.PostedFile.ContentLength 为上传文件的总长度int bytes = this.fileUpload.PostedFile.InputStream.Read(buffer, 0, bufferSize);
    UploadedLength += bytes;
    UploadedLength为已上传的长度如下的事情就是怎么表现了
      

  13.   

    看下我的博客,关于jquery上传文件的带进度条的:
    http://www.cnblogs.com/chenping-987123/archive/2010/09/25/1834372.html
      

  14.   

    “<%@ Register Assembly="MattBerseth.WebControls.AJAX" Namespace="MattBerseth.WebControls.AJAX.Progress" TagPrefix="mb" %>”这个是哪里的什么东西啊?