0

我正在使用上传文件并想根据文件大小显示进度条。

我不知道如何使用根据文件大小工作的进度条。

<script language='Javascript' type="text/javascript">

  function addFile() {

        var ni = document.getElementById("fileDiv");

        var objFileCount = document.getElementById("fileCount");
        var num = (document.getElementById("fileCount").value - 1) + 2;
        objFileCount.value = num;
        var newdiv = document.createElement("div");
        var newdiv1 = document.createElement("div");
        var divIdName = "file" + num + "Div";
        newdiv.setAttribute("id", divIdName);
        newdiv.innerHTML = '<input type="file" name="attachment" id="attachment"/><a href="#" onclick="javascript:removeFile(' + divIdName + ');">Remove </a>';
        ni.appendChild(newdiv);

  }

  function removeFile(divName) {
        var d = document.getElementById("fileDiv");
  d.removeChild(divName);

}

</script>

<div>
     <input type="file" name="attachment" runat="server" id="attachment" onchange="document.getElementById('moreUploadsLink').style.display = 'block';" />
      <input type="file" name="attachment" runat="server" id="File1" visible="false"/>
     <div id="process" style="height:10px; width:150px; background-color:Gray"></div>
  <input type="hidden" value="0" id="fileCount" />
  <div id="fileDiv">
  </div>
  <div id="moreUploadsLink" style="display: none">
        <a href="javascript:addFile();">Attach another File</a>
  </div>
  <asp:Button ID="btnUpload" runat="server" Text="Upload" OnClick="btnUpload_Click" />
</div>

这是我的代码:

protected void btnUpload_Click(object sender, EventArgs e)
{
    HttpFileCollection uploadFiles = Request.Files;
    for (int i = 0; i < uploadFiles.Count; i++)
    {
        HttpPostedFile uploadFile = uploadFiles[i];
        string fileName = Path.GetFileName(uploadFile.FileName);
        if (fileName.Trim().Length > 0)
        {
            uploadFile.SaveAs(Server.MapPath("Others/") + fileName);
        }
    }
}

当第一次加载页面时,它会显示一个带有上传按钮的文件上传控件。

当我选择一个文件后,会出现一个带有名称的锚按钮附加另一个文件。

当我再次单击它时,会出现另一个文件上传控件。

就像您可能见过的 Gmail 一样。

现在我添加了一个 div id 是文件上传控件下方的进度,我希望当他们单击附加文件时,每个文件上传控件的进度条都应该像 Gmail 一样显示。

我不想要任何 jQuery 代码

提前致谢。

4

1 回答 1

0

这是一个有趣的解决方案http://www.ultramegatech.com/2010/10/create-an-upload-progress-bar-with-php-and-jquery/

对于快速简单的事情,请使用http://www.uploadify.com/

这是另一种常用方法,但同样,您的服务器需要 APC http://www.johnboy.com/php-upload-progress-bar/

于 2012-09-07T17:19:14.797 回答