Jquery Uploadify多文件上传带进度条且传递自己的参数

复制代码 代码如下:

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

  <html xmlns="http://www.w3.org/1999/xhtml">

  <head id="Head1" runat="server">

  <title>Jquery Uploadify上传带进度条,且多参数</title>

  <link href="js/jquery.uploadify-v2.1.4/uploadify.css" rel="stylesheet" type="text/css" />

  <script type="text/javascript" src="js/jquery.uploadify-v2.1.4/jquery-1.4.2.min.js"></script>

  <script type="text/javascript" src="js/jquery.uploadify-v2.1.4/swfobject.js"></script>

  <script type="text/javascript" src="js/jquery.uploadify-v2.1.4/jquery.uploadify.v2.1.4.min.js"></script>

  <script type="text/javascript">

  $(document).ready(function () {

  $("#uploadify").uploadify({

  'uploader': 'js/jquery.uploadify-v2.1.4/uploadify.swf', //uploadify.swf文件的路径

  'script': 'UploadHandler.ashx', //处理文件上传的后台脚本的路径

  'cancelImg': 'js/jquery.uploadify-v2.1.4/cancel.png',

  'folder': 'UploadFile/<% = DateTime.Now.ToString("yyyyMMdd") %>', //上传文件夹的路径按20130416

  'queueID': 'fileQueue', //页面中,你想要用来作为文件队列的元素的id

  'auto': false, //当文件被添加到队列时,自动上传

  'multi': true, //设置为true将允许多文件上传

  'fileExt': '*.jpg;*.gif;*.png', //允许上传的文件后缀

  'fileDesc': 'Web Image Files (.JPG, .GIF, .PNG)', //在浏览窗口底部的文件类型下拉菜单中显示的文本

  'sizeLimit': 102400, //上传文件的大小限制,单位为字节 100k

  'onAllComplete': function (event, data) { //当上传队列中的所有文件都完成上传时触发

  alert(data.filesUploaded + ' 个文件上传成功!');

  }

  });

  });

  function uploadpara() {

  //自定义传递参数

  $('#uploadify').uploadifySettings('scriptData', { 'name': $('#txtName').val(), 'albums': $('#txtAlbums').val() });

  $('#uploadify').uploadifyUpload();

  }

  </script>

  </head>

  <body>

  <form id="form1" runat="server">

  <div>

  用户名:<asp:TextBox ID="txtName" runat="server"></asp:TextBox><br/>

  相册名:<asp:TextBox ID="txtAlbums" runat="server"></asp:TextBox>

  </div>

  </form>

  <div id="fileQueue"></div>

  <input type="file" name="uploadify" id="uploadify" />

  <p>

  <a href="javascript:void(0);" onclick="uploadpara();">上传</a>|

  <a href="javascript:$('#uploadify').uploadifyClearQueue()">取消上传</a>

  </p>

  </body>

  </html>

  

复制代码 代码如下:

  <%@ WebHandler Language="C#" Class="UploadHandler" %>

  using System;

  using System.Web;

  using System.IO;

  /// <summary>

  /// UploadHandler文件上传

  /// </summary>

  public class UploadHandler : IHttpHandler

  {

  public void ProcessRequest(HttpContext context)

  {

  context.Response.ContentType = "text/plain";

  context.Response.Charset = "utf-8";

  HttpPostedFile file = context.Request.Files["Filedata"];

  string uploadPath = HttpContext.Current.Server.MapPath(@context.Request["folder"]);

  string name = context.Request.Params["name"]; //获取传递的参数

  string albums = context.Request.Params["albums"];

  if (file != null)

  {

  if (!Directory.Exists(uploadPath))

  {

  Directory.CreateDirectory(uploadPath);

  }

  file.SaveAs(Path.Combine(uploadPath, file.FileName));

  context.Response.Write("1");

  }

  else

  {

  context.Response.Write("0");

  }

  }

  public bool IsReusable

  {

  get

  {

  return false;

  }

  }

  }