我正在使用上传文件并想根据文件大小显示进度条。
我不知道如何使用根据文件大小工作的进度条。
<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 代码
提前致谢。