Question

我在更新面板中有一个异步文件上传，并在选择文件后上传文件。文件上传时，我显示更新进度。这里我有一张图片说处理。上传完成后，图像消失。而不是显示图像我如何显示上传的百分比。

<asp:UpdateProgress ID="UpdateProgress2" runat="server">
                            <ProgressTemplate>
                                <div>
                                    <b>Please Wait...</b>
                                    <img runat="server" id="ajaxLoader" style="background-color: White; width: 338px;"
                                        src="styles/images/loadImage.gif" alt="loading" />
                                </div>
                            </ProgressTemplate>
                        </asp:UpdateProgress>

Answer 1

你可以试试：

<head runat="server">
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script>
<script src="http://malsup.github.com/jquery.form.js"></script>
<script>
$(document).ready(function(){
var options = {
    beforeSend: function () {
    $("#progress").show();
    //clear everything
    $("#bar").width('0%');
    $("#message").html("");
    $("#percent").html("0%");
                             },
    uploadProgress: function (event, position, total, percentComplete) {
        $("#bar").width(percentComplete + '%');
        $("#percent").html(percentComplete + '%');
            },
    success: function () {

    $("#bar").width('100%');
    $("#percent").html('100%');
       },
    complete: function (response) {
    $("#message").html("<font color='green'>" + response.responseText + "</font>");
       },
    error: function () {
    $("#message").html("<font color='red'> ERROR: unable to upload files</font>");
    }
   };
  $("#form1").ajaxForm(options);

  });
</script>

 <body>
<form id="form1" action="AjaxUploadFile.aspx" method="post" enctype="multipart/form-data" runat="server">
<div>
 <input type="file" size="60" name="myfile" />
 <input type="submit" value="Ajax File Upload" />
 <div id="progress">
 <div id="bar"></div>
 <div id="percent">0%</div >
 </div>
 <br/>
 <div id="message"></div>
</div>
</form>

代码背后的代码：

protected void Page_Load(object sender, EventArgs e)
    {

        HttpPostedFile file =null;
        if (Request.Files.Count>0)
        {
            file = Request.Files[0];
            file.SaveAs(Server.MapPath("~/UploadedFiles/")+file.FileName);
        }
    }

Answer 2

此处不可能，您可能会显示动画图片，或者您可以尝试使用jQuery插件或uplodify。

如何在asp.net中显示上传百分比

2 个答案: