现在的位置: 首页 > 综合 > 正文

asp.net 多张图片上传

2013年04月06日 ⁄ 综合 ⁄ 共 8173字 ⁄ 字号 评论关闭

先看界面 

url界面设计

运行效果

图片预览效果

code:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm12.aspx.cs" Inherits="jquerytest.test1.WebForm12" %>

<!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 runat="server">
    <title></title>
    <link rel="shortcut icon" href="http://www.zhangxinxu.com/zxx_ico.png" />
<link rel="stylesheet" href="../css/common.css" type="text/css" />
<link rel="stylesheet" href="../css/boxy.css" type="text/css" />



    <script src="../jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
    <script type="text/javascript" src="../js/jquery.boxy.js"></script>

    

<script type="text/javascript">
    $(function() {
        $(".boxy").boxy();
    });
</script>
<style type="text/css"> 
.zxx_test_list p{padding:7px 0 3px; font-size:0.95em;}
.zxx_test_list p strong,.f8{font-size:0.9em;}
.zxx_ul_circle{padding-left:20px; padding-bottom:10px;}
.zxx_ul_circle li{list-style-type:disc; list-style-position:outside; padding-top:5px; font-size:0.9em;}
#form{display:inline; margin:0 0 0 20px; padding:0;}
.zxx_ul_table{display:inline-block; *display:inline; border:1px solid #828da1; margin-top:-1px; font-size:0.9em; overflow:hidden; zoom:1;}
.zxx_ul_table li{padding:2px 5px 2px 10px; float:left;}
.zxx_ul_table.title li{background:#CBE0FF;}
.zxx_ul_table .w1{width:90px;}
.zxx_ul_table .w2{width:250px; border-left:1px solid #828da1; border-right:1px solid #828da1;}
.zxx_ul_table .w3{width:120px;}
.font{font-style:italic;}
.zxx_left_menu{position:fixed!important; position:absolute; left:3px; top:80px; width:13%; padding:10px 6px; background:white; border-bottom:1px solid #cccccc; border-right:1px solid #cccccc;}
.zxx_left_menu li{border-bottom:1px dashed #cccccc; font-size:12.9px;}
.zxx_left_menu li a{display:block; padding:6px 0 4px 5px; text-decoration:none;}
.zxx_left_menu li a:hover{background:#eeeeee; color:#34538b;}
</style>

    
    
</head>
<body>

<center>
<h2>
     </h2>
    <form id="form1" runat="server">
    <div>
         
       
        <asp:Label ID="Label1" runat="server" Style="font-weight: bold; font-size: x-large"
            Text="文件上传操作示例"></asp:Label>
    
    </div>
        <table border="1" style="width: 676px; height: 197px">
            <tr>
                <td colspan="3">
                    <asp:FileUpload ID="FileUpload1" runat="server" Width="404px" Height="29px" /></td>
            </tr>
            <tr>
                <td colspan="3" rowspan="2">
                    <asp:Label ID="lblResult" runat="server" ForeColor="Red"></asp:Label></td>
            </tr>
            <tr>
            </tr>
            <tr>
                <td colspan="2" rowspan="1" style="width: 2503px; height: 25px;" align="center">
                    <asp:Button ID="btnAdd" runat="server" Text="增 加" OnClick="btnAdd_Click" />
                 </td>
                <td><asp:Button ID="btnUpload" runat="server" OnClick="btnUpload_Click" Text="上 传" /></td>
            </tr>
            <tr>
                <td align="center" colspan="3" rowspan="1">
                    <asp:CheckBox ID="CheckBox1" runat="server" Text="上传后清空上传文件列表" AutoPostBack="True" /></td>
            </tr>
            <tr>
                <td colspan="3">
                


                            

           
                    
                    <asp:DataList ID="DataList1" runat="server" CellPadding="3" Height="1px" 
                        Width="615px" BackColor="White" BorderColor="#E7E7FF" BorderStyle="None" 
                        BorderWidth="1px" GridLines="Horizontal" 
                        ondeletecommand="DataList1_DeleteCommand">
                        <FooterStyle BackColor="#B5C7DE" ForeColor="#4A3C8C" />
                        <SelectedItemStyle BackColor="#738A9C" Font-Bold="True" ForeColor="#F7F7F7" />
                        <AlternatingItemStyle BackColor="#F7F7F7" />
                        <ItemStyle BackColor="#E7E7FF" ForeColor="#4A3C8C" />
                        <HeaderStyle BackColor="#4A3C8C" Font-Bold="True" ForeColor="#F7F7F7" />
                        <ItemTemplate>

                        <table style="width: 450px; height: 54px" border="1" >                     
                             <tr>
                                <td>
                                    图片预览:
                                </td>
                                <td style="width: 200px">
                                
                                <a href="#" onclick="window.open('WebForm18.aspx?imgs=<%#Eval("imgName")%>');">xxxxx</a>

                                </td>
                                 <td rowspan="4">
                                   <asp:Button ID="Delete" Runat="server"  Text="Delete" CommandName="delete" CommandArgument='<%#Eval("imgName")%>' />
                                   
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    文件名称:
                                </td>
                                <td style="width: 200px">
                                    <%#Eval("imgName")%>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    文件大小:
                                </td>
                                <td style="width: 200px">
                                    <%#Eval("imgSize")%>字节
                                </td>
                            </tr>
                            <tr>
                                <td style="height: 20px">
                                    文件类型:
                                 </td>
                                <td style="width: 200px; height: 20px;">
                                    <%#Eval("imgType")%>
                                 </td>
 
                            </tr>
                    
                    
                            </table>
                        </ItemTemplate>
                        <HeaderTemplate>
                            上传文件列表
                        </HeaderTemplate>
                    </asp:DataList>
                </td>
            </tr>
            </table>
            
            
            <div id="foobar" style="padding:15px; display:none; background-color:#cad5eb; font-size:2em; color:#000000; font-weight:bold;">这是一段ID为foobar的div标签内的文字</div>
    </form>
    </center>

</body>
</html>
<%-- <p>1.<a href="#foobar" title="展现href锚点对应ID内容" class="boxy">锚点#对应ID的内容(div#foobar)</a></p>--%>

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Collections;

using System.Data;
using System.IO;

namespace jquerytest.test1
{
    public partial class WebForm12 : System.Web.UI.Page
    {

        //public DataTable dtImages = new DataTable();

        protected void Page_Load(object sender, EventArgs e)
        {


            
        }

        /// <summary>
        /// 增加按钮
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        protected void btnAdd_Click(object sender, EventArgs e)
        {
            DataTable dtImages = new DataTable();
            string filename = FileUpload1.PostedFile.FileName;


            if (DataList1.Items.Count > 4)
            {//item下标从0开始,最多只能添加5条数据
                ShowMsg("只能添加5条数据");
                return;
            }

            //检查是否有文件要上传
            if (this.FileUpload1.HasFile)
            {
                filename = FileUpload1.FileName;
                string extension = System.IO.Path.GetExtension(filename).ToLower();//获得后缀名

                if (this.FileUpload1.PostedFile.ContentLength > 4096000)
                {
                    ShowMsg("文件不能超过4M!");
                    return;
                }

                if (extension == ".jpg" || extension == ".png")
                {
                    DateTime dt = DateTime.Now;
                    string truefilename = string.Format("{0:yyyyMMddHHmmssffff}", dt) + extension;

                    if (Session["UPLOAD"] == null)
                    {
                        dtImages.Columns.Add("imgName", typeof(string));
                        dtImages.Columns.Add("imgSize", typeof(string));
                        dtImages.Columns.Add("imgType", typeof(string));
                        dtImages.Columns.Add("imgUrl",  typeof(object));
                        dtImages.Rows.Add(new object[] { truefilename, this.FileUpload1.PostedFile.ContentLength, this.FileUpload1.PostedFile.ContentType,this.FileUpload1.PostedFile });
                        Session["UPLOAD"] = dtImages;

                    }
                    else
                    {
                        dtImages = Session["UPLOAD"] as DataTable;
                        dtImages.Rows.Add(new object[] { truefilename, this.FileUpload1.PostedFile.ContentLength, this.FileUpload1.PostedFile.ContentType,this.FileUpload1.PostedFile });
                        Session["UPLOAD"] = dtImages;

                    }

                }
                else
                {
                    ShowMsg("请上传jpg或png的图片格式!");
                    
                }

 
            }
            else
            {
                lblResult.Text = "请选择上传文件!";
            }




  
                DataList1.DataSource = Session["UPLOAD"];
                DataList1.DataBind();
            

        }

        /// <summary>
        /// 上传按钮
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param> n,
        protected void btnUpload_Click(object sender, EventArgs e)
        {
            string strPath = Server.MapPath("~/files/");

            if (Session["UPLOAD"] != null)
            {
                //从DataTable中取出要上传的文件
                DataTable dtUpload = Session["UPLOAD"] as DataTable;
                for (int i = 0; i < dtUpload.Rows.Count; i++)
                {
                    HttpPostedFile PostedFile = dtUpload.Rows[i]["imgUrl"] as HttpPostedFile;

                    //将文件上传到指定路径
                    PostedFile.SaveAs(strPath + System.IO.Path.GetFileName(dtUpload.Rows[i]["imgName"].ToString()));
                }
                lblResult.Text = "上传成功!";
            }

            //上传后清空上传文件列表
            if (CheckBox1.Checked)
            {
                Session["UPLOAD"] = null;
                DataList1.DataSource = Session["UPLOAD"];
                DataList1.DataBind();
            }
        }

        #region 消息提示
        /// <summary>
        /// 消息提示
        /// </summary>
        /// <param name="strMsg">消息</param>
        public void ShowMsg(string strMsg)
        {
            string script = "<script>setTimeout(function(){ alert('" + strMsg + "');},1000)</script>";
            this.Page.ClientScript.RegisterStartupScript(this.GetType(), Guid.NewGuid().ToString(), script);

        }

        /// <summary>
        /// 消息提示(跳转页面)
        /// </summary>
        /// <param name="strMsg">消息</param>
        /// <param name="jumpNum">跳转参数</param>
        public void ShowMsg(string strMsg, string page, int jumpNum)
        {
            string script = "";
            if (jumpNum == 0)
                script = "<script>setTimeout(function(){ alert('" + strMsg + "');window.location.href='" + page + "';},1000)</script>";
            else
                script = "<script>setTimeout(function(){ alert('" + strMsg + "');parent.window.location='" + page + "';parent.closeEditor();},1000)</script>";
            this.Page.ClientScript.RegisterStartupScript(this.GetType(), Guid.NewGuid().ToString(), script);

        }
        #endregion

        protected void DataList1_DeleteCommand(object source, DataListCommandEventArgs e)
        {
            //int id = (int)DataList1.DataKeys[e.Item.ItemIndex];

            string strPath = Server.MapPath("~/files/");
            if (e.CommandName == "delete")
            {
                DataTable tb = Session["UPLOAD"] as DataTable;
                DataRow[] row = tb.Select("imgName='" + e.CommandArgument + "'");
                row[0].Delete();
                Session["UPLOAD"] = tb;
                DataList1.DataSource = tb;
                DataList1.DataBind();

                DelFiles(strPath + e.CommandArgument);
               
               
            }

        }

        //删除文件
        public void DelFiles(string path)
        {
            if (File.Exists(path))
            {
                File.Delete(path);
            }
        }


    }
}

多张图片上传会引发    

无法访问已关闭的文件 异常 为什么会出现这个

由于图片文件大小 太大,上传到服务器要消耗时间,大图片没上传好另一张 图片又开始上传了。

你会发现 异常出现的地方 图片上传到服务器 是 0kb的.

怎么解决这个问题。

1,可以在web.config配置上传限制 代码。

这个配置 也只能解决 部分问题。

<httpRuntime
executionTimeout="90" maxRequestLength="2097151" useFullyQualifiedRedirectUrl="false"
requestLengthDiskThreshold
="8192"/>

2,引用system.Thread 类  设置 线程休眠时间 缓解压力  Tread.sleep(2000), 最好是计算图片大小 算出要给图片上传多少休眠时间。

抱歉!评论已关闭.