zoukankan      html  css  js  c++  java
  • input file实现多张图片上传

    网上找的.

    注意:页面上初始的file控件必须有runat="server"标志。也就是说,这个页面上必须至少有一个runat="server"的file控件,否则后台接收不到Request.Files。
    <FORM id="form1" runat="server">
                <DIV id="div1">
                    <INPUT ID="File1" TYPE="file" NAME="File1" runat="server">
                    <INPUT TYPE="button" VALUE="添加附件" onclick="javascript:AddFile();">
                    <INPUT TYPE="button" VALUE="删除附件" onclick="javascript:RemoveFile();">
                    <ASP:LISTBOX id="ListBox1" Width="200px" Height="100px" runat="server"> </ASP:LISTBOX>
                    <ASP:BUTTON id="Button1" runat="server" Text="保存" Width="60px"> </ASP:BUTTON>
                </DIV>
                <ASP:LITERAL ID="lResult" Runat="server"> </ASP:LITERAL>
               
            </FORM>


    <SCRIPT language="javascript">
    <!--
    function AddFile()
    {   
     
        var file = document.getElementById("div1").firstChild;
        if(file.value == "")
        {
            alert("请选择文件!");
            return;
        }
       
        var ary = file.value.split("\");
        var filename = ary[ary.length-1];
       
        var bAddFile = true;
        if(CheckOptionsExists(filename,document.getElementById("ListBox1")))
        {
           
            alert("文件已经存在列表中!");
            div1.removeChild(file);
            bAddFile = false;
           
        }
       
       
        var f = document.createElement("input");
        f.type = "file";
        f.name = "file"
       
        div1.insertBefore(f,div1.firstChild);
       
        if(!bAddFile)
        {
            return
        }
        var o = new Option();
        o.innerText = filename;
        o.value = file.uniqueID;
        document.getElementById("ListBox1").appendChild(o);
       
        file.style.display = "none";
       
       
       
    }

    function RemoveFile()
    {
        var lst = document.getElementById("ListBox1");
        if(lst.selectedIndex == -1)
        {
            alert("请选择要删除的附件!");
            return;
        }
       
        var id = lst.value;
        div1.removeChild(document.all[id]);
        lst.removeChild(lst.options[lst.selectedIndex]);
        div1.firstChild.style.display = "";
       
    }

    //检查选项是否存在.
    function CheckOptionsExists(value,ddl)
    {
        for(var i=0;i <ddl.options.length;i++)
        {
            if(ddl.options[i].innerText == value)
            {
                return true;
            }
        }
        return false;
    }

    //-->
            </SCRIPT>

    后台代码就比较简单了。没有过多的处理,只是一个简单的保存。

    private void Button1_Click(object sender, System.EventArgs e)
            {
               
                for(int i=0;i <Request.Files.Count;i++)
                {
                    if(Request.Files[i].ContentLength >0)
                    {
                        string filename = System.IO.Path.GetFileName(Request.Files[i].FileName);
                        Request.Files[i].SaveAs(Server.MapPath(filename));
                        this.ListBox1.Items.Add(new ListItem(filename,filename));
                    }

                    this.lResult.Text = "保存成功!";
                }
               
            }

  • 相关阅读:
    htb系列-Web Challenges-Console
    htb系列-Web Challenges-FreeLancer
    离散数学1复习要点
    样本均值和总体均值的区别
    chapter7.参数估计
    计算机系统基础复习指北
    C语言学生信息管理系统
    数学的意义
    计算机系统基础第一章
    C语言文件读写的操作
  • 原文地址:https://www.cnblogs.com/juan/p/1488624.html
Copyright © 2011-2022 走看看