Asp.net实现同页面内多图片自动上传并带预览显示

FileUpload控件实现单按钮图片自动上传并带预览显示

1.实现原理：

此方法适合针对有后台生成的图片相关内容，例如购物网站商品展示页面中的封面图片，图片的数量由后台访问数据库，并加载到页面。这种情况下，将会有x个FileUpload控件调用__doPostBack方法来用LinkButton的OnClick事件模拟一个事件触发的过程，由于上传控件的数量不固定，不可能使用多个用LinkButton的OnClick事件模拟事件触发的过程。也就是说只能有多个FileUpload控件调用一个LinkButton的OnClick事件模拟事件触发的过程。
多个FileUpload控件调用一个LinkButton的OnClick事件模拟事件触发的过程，由于上传每个图片后都需要显示相应的图片预览，就需要区分出来是每一次都是哪个FileUpload控件进行的上传操作，要加载哪一个图片。 __doPostBack('lbtnUpload1','')后面''的地方可以传递参数，我们可以从此处着手，对每一个图片相关的上传控件，图片预览框进行统一标识。
如何获取参数：
这个两个值在后台可以通过下边方法得到：
Request["__EVENTTARGET"] ：获取得到引发页面PostBack的控件ID
Request["__EVENTARGUMENT"]： 获取参数。

2.关键代码：

页面代码：

 <asp:FileUpload ID="fuPhoto1" onchange="javascript:__doPostBack('lbUploadPhoto','1')"  runat="server" ToolTip="选择图片" ForeColor="White" Width=""/><br />
 <img id="img" runat="server" src="" /><br />
 <asp:FileUpload ID="fuPhoto2" onchange="javascript:__doPostBack('lbUploadPhoto','2')"  runat="server" ToolTip="选择图片" ForeColor="White" Width=""/><br />
 <asp:LinkButton ID="lbUploadPhoto" runat="server" OnClick="lbUploadPhoto_Click"></asp:LinkButton>

注意： __doPostBack('lbUploadPhoto','2')，第一个参数为LinkButton的名称，即name值。

后台代码：

  /// <param name="e"></param>
         protected void lbUploadPhoto_Click(object sender, EventArgs e)
         {
             fileUpload(Request["__EVENTARGUMENT"]);
         }
         //从控件上传文件
         public void fileUpload(string number)
         {
             FileUpload fu = FindControl("fuPhoto"+number) as FileUpload;
             if (fu.PostedFile != null && fu.PostedFile.ContentLength > )
             {
                 //1. 验证文件格式
                 string ext = System.IO.Path.GetExtension(fu.PostedFile.FileName).ToLower();
                 if (ext != ".jpg" && ext != ".gif" && ext != ".png")
                 {
                     Response.Write("文件非法！");
                     return;
                 }
                 string savePath = Server.MapPath("~/upload/");//指定上传文件在服务器上的保存路径
                 //2. 检查服务器上是否存在这个物理路径，如果不存在则创建
                 if (!System.IO.Directory.Exists(savePath))
                 {
                     System.IO.Directory.CreateDirectory(savePath);
                 }
                 Random random = new Random(DateTime.Now.Millisecond);
                 string fileName = DateTime.Now.ToString("yyMMddhhmmss") + random.Next() + ext;
                 string path = savePath + fileName;
                 fu.PostedFile.SaveAs(path);
                 Image img=FindControl("img"+number) as Image;
                 img.Src = "upload/" + fileName;
             }
             else
             {
                 //没有图片的情况处理
             }
         }