使用ASP.NET上传多个文件到服务器

最新推荐文章于 2021-07-31 00:36:24 发布

amandag

最新推荐文章于 2021-07-31 00:36:24 发布

阅读量1w

点赞数

分类专栏： ASP.NET 2.0 文章标签： asp.net stylesheet 服务器 class function xhtml

本文链接：https://blog.csdn.net/amandag/article/details/4005718

版权

ASP.NET 2.0 专栏收录该内容

14 篇文章 0 订阅

订阅专栏

在Email系统中经常会上传多个文件到服务器，用户大多习惯一次上传所有的文件，而不是逐个上传，我们可以使用javascript动态地添加file元素到表单，然后在服务器端处理这些file

效果图如下:

多文件上传

页面代码MutlileFileUpload.aspx如下:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="MutlileFileUpload.aspx.cs"
    Inherits="MutlileFileUpload" %>

<!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>
    <title>多文件上传到服务器Demo</title>
    <link href="css/writemail.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
<!--
        var MAXFILES = 5;        //文件计数器       
        var fileCount = 0;
        function addAttach(noAlert) {
            if (fileCount >= MAXFILES && !noAlert) { alert("最多只能添加" + MAXFILES + "个附件！"); return; }

            var fileSectionDiv = document.getElementById("files");
            var fileItemDiv = document.createElement("div");
            fileCount++;
            var content = "<input type='file' οnchange='return addAttach(true);' name='fileUpload'" + fileCount + "> <a href='#' οnclick='return delAttach(\"" + fileCount + "\")' class='delete_attach' >移除附件</a>";
            fileItemDiv.id = "fileItemDiv" + fileCount;
            fileItemDiv.innerHTML = content;
            fileSectionDiv.appendChild(fileItemDiv); 
             return false;
         }

         function delAttach(fileIndex) {
             var fileSectionDiv = document.getElementById("files");
             var fileItemDiv = document.getElementById("fileItemDiv" + fileIndex);
             fileSectionDiv.removeChild(fileItemDiv);
             fileCount--;
             return false; 
        }    // 
 --></script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <a id="addAttach_a" οnclick="return addAttach(false);" href="#"  class="add_attach">添加附件</a>
        <div id="files">
        </div>
        <asp:Button ID="btnSend" runat="server" Text="发送" OnClick="btnSend_Click" />
    </div>
    </form>
</body>
</html>

样式表WriteMail.css代码如下:

.delete_attach {PADDING-LEFT: 18px; BACKGROUND: url(../images/deleteattch_icon.gif) no-repeat left top; MARGIN-LEFT: 7px; WIDTH: 90px; COLOR: #002f76}.add_attach {PADDING-LEFT: 22px; BACKGROUND: url(../images/attach.gif) no-repeat left center; WIDTH: 90px; COLOR: #002f76}

后台代码MutlileFileUpload.aspx.cs如下:

using System;
using System.IO;
using System.Web.UI;

public partial class MutlileFileUpload : System.Web.UI.Page
{
    protected void Page_Load(object sender, System.EventArgs e)
    {        //告诉表单如何格式化文件信息 
        Page.Form.Enctype = "multipart/form-data";
    }
    protected void btnSend_Click(object sender, EventArgs e)
    {
        for (int index = 0; index < Request.Files.Count; index++)
        {
            if (!string.IsNullOrEmpty(Request.Files[index].FileName))
            {
                Request.Files[index].SaveAs(Path.Combine(Server.MapPath("Files"), System.IO.Path.GetFileName(Request.Files[index].FileName)));
            }
        }
    }
}

amandag

关注

0
点赞
踩
12

收藏

觉得还不错? 一键收藏
3
评论
使用ASP.NET上传多个文件到服务器

在Email系统中经常会上传多个文件到服务器，用户大多习惯一次上传所有的文件，而不是逐个上传，我们可以使用javascript动态地添加file元素到表单，然后在服务器端处理这些file效果图如下:页面代码MutlileFileUpload.aspx如下: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="MutlileFileUplo
复制链接

扫一扫

专栏目录