js实现文件批量上传

最新推荐文章于 2024-07-12 17:13:22 发布

sunningliu

最新推荐文章于 2024-07-12 17:13:22 发布

阅读量3.5k

点赞数

文章标签： button file server function regex input

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.csdn.net/sunningliu/article/details/4219171

版权

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

<!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 id="Head1" runat="server">
    <title>Untitled Page</title>
    <script language="javascript" type="text/javascript">
function addFile()
{
    //创建输入元素(通用代码)
    //添加上传文件按钮
    var fileUpLoadbutton = document.createElement("input");
    fileUpLoadbutton.setAttribute("type","file");
    fileUpLoadbutton.setAttribute("size","50");
    fileUpLoadbutton.setAttribute("name","File");
    fileUpLoadbutton.setAttribute("class","ButtonCss");
    //添加删除按钮
    var deleteImgbutton = document.createElement("img");
    deleteImgbutton.setAttribute("src","images/Btdelete.gif");
    deleteImgbutton.setAttribute("style","width: 38px; height: 20px");
    //给
    deleteImgbutton.οnclick=function(){deleteRow(1,this);};

    var lastIndex= document.getElementById('FileList').childNodes.length-1;


     if(lastIndex>-1)
     {


        var hideFile=document.getElementById('FileList').childNodes[lastIndex];

         if(hideFile.value=="")
         {
            return;
         }

        hideFile.style.display="none";
        var cell1 = document.createElement("td");
        var cell2 = document.createElement("td");
       // var str = hideFile.value;
        var myList =new Array();
        myList= hideFile.value.split("//");
        cell1.innerHTML = myList[myList.length-1];// hideFile.value;
        cell2.appendChild(deleteImgbutton);
        var row = document.createElement("tr");
        row.appendChild(cell1);
        row.appendChild(cell2);
        var tBody = document.createElement("tbody").appendChild(row);
        //识别当前浏览器
        if(navigator.appName.indexOf("Explorer") > -1)
        {
            document.getElementById("FileTable").childNodes[0].appendChild(tBody);
        }
        else
        {
            document.getElementById("FileTable").appendChild(tBody);
        }
     }

     document.getElementById('FileList').appendChild(fileUpLoadbutton);
}

   function deleteRow(targPos,btnObj)
    {
       var tabObj=document.getElementById("FileTable");

        var fileListLength = document.getElementById('FileList').childNodes.length;

        var tabRowsLength = tabObj.rows.length;

        for(var i =0;i<tabRowsLength;i++)
        {
            if(tabObj.getElementsByTagName('img')[i]==btnObj)
            {
                 //删除当前选中行
                tabObj.deleteRow(i+targPos);
                //获得选中行对应的上传我文件对象
                var oldChild = document.getElementById('FileList').childNodes[i];
                //删除上传文件对象
                document.getElementById('FileList').removeChild(oldChild);

            }
        }
}

    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <table border="0" cellpadding="0" cellspacing="0" height="26" width="100%">
            <tr>
                <td align="left" valign="middle">
                    <asp:Button ID="Button2" runat="server" OnClick="Button2_Click" Text="提交" />
                   </td>
            </tr>
        </table>
         <table border="0" cellpadding="0" cellspacing="0" height="26" width="100%">
            <tr>
                <td align="left" valign="middle">
                   <DIV id="FileList"><input id="File1" runat="server" name="File" size="50" type="file" /></DIV>
                </td>
                <td>
                   <input id="Button1" οnclick="addFile()" size="26" style="height: 26px" type="button" value="增加附件" />
                </td>
            </tr>
        </table>
         <table style="width:100%" id="FileTable">

            <tr>
                <td style="width:80%">FileName</td>
                <td style="width:80%">button</td>

            </tr>

        </table>
    </div>
    </form>
</body>
</html>

CS文件：

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.IO;
using System.Text.RegularExpressions;

public partial class AppModules_JC_ASCXSearch_Default2 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        Regex badCharReplace = new Regex(@"^([<>""'%;()&])$");

    }
    protected void Button2_Click(object sender, EventArgs e)
    {
        /**/
        /附件
        HttpFileCollection fileList = HttpContext.Current.Request.Files;
        //保存附件
        for (int i = 0; i < fileList.Count; i++)
        {   /**添加单个附件
            HttpPostedFile file = fileList[i];
            if (file.FileName.Length <= 0 || file.ContentLength <= 0)
            {
                break;
            }
            // 保存附件到硬盘中
            file.SaveAs(MapPath("Attachments/" + Path.GetFileName(file.FileName)));

}
}

}

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。