织梦前台上传参考jQuery Uploadify 3.2上传插件使用

织梦前台上传参考jQuery Uploadify 3.2上传插件使用

 

下载下来解压后估计里面很多文件，其实有用的也就一个jquery.uploadify.js和uploadify.swf这两个文件。当然啦，jQuery库那是必须的。

在你使用的项目中，把jquery.uploadify.js引入以后，用法和大多数JQ插件一样。同时也要记得引入swfobject.js这个插件，版本2.2以上的。使用方法例如：

$(function() {
    $("#file_upload_1").uploadify({
 height : 30,
 swf    : '/uploadify/uploadify.swf',
 uploader      : '/uploadify/UploadHandler.ashx',
 width  : 120
    });
});

，上面的只是简单的事例，下面我就把我在项目中做的发出来，每个都有解释：file_upload_1其实也就是一个容器ID，比如

$(document).ready(function() {
    $("#file_upload").uploadify({
 //开启调试
 'debug' : false,
 //是否自动上传
 'auto':false,
 //超时时间
 'successTimeout':99999,
 //附带值
 'formData':{
     'userid':'用户id',
     'username':'用户名',
     'rnd':'加密密文'
 },
 //flash
 'swf': "uploadify.swf",
 //不执行默认的onSelect事件
 'overrideEvents' : ['onDialogClose'],
 //文件选择后的容器ID
 'queueID':'uploadfileQueue',
 //服务器端脚本使用的文件对象的名称 $_FILES个['upload']
 'fileObjName':'upload',
 //上传处理程序
 'uploader':'imageUpload.php',
 //浏览按钮的背景图片路径
 'buttonImage':'upbutton.gif',
 //浏览按钮的宽度
 'width':'100',
 //浏览按钮的高度
 'height':'32',
 //expressInstall.swf文件的路径。
 'expressInstall':'expressInstall.swf',
 //在浏览窗口底部的文件类型下拉菜单中显示的文本
 'fileTypeDesc':'支持的格式：',
 //允许上传的文件后缀
 'fileTypeExts':'*.jpg;*.jpge;*.gif;*.png',
 //上传文件的大小限制
 'fileSizeLimit':'3MB',
 //上传数量
 'queueSizeLimit' : 25,
 //每次更新上载的文件的进展
 'onUploadProgress' : function(file, bytesUploaded, bytesTotal, totalBytesUploaded, totalBytesTotal) {
      //有时候上传进度什么想自己个性化控制，可以利用这个方法
      //使用方法见官方说明
 },
 //选择上传文件后调用
 'onSelect' : function(file) {
      
 },
 //返回一个错误，选择文件的时候触发
 'onSelectError':function(file, errorCode, errorMsg){
     switch(errorCode) {
  case -100:
      alert("上传的文件数量已经超出系统限制的"+$('#file_upload').uploadify('settings','queueSizeLimit')+"个文件！");
      break;
  case -110:
      alert("文件 ["+file.name+"] 大小超出系统限制的"+$('#file_upload').uploadify('settings','fileSizeLimit')+"大小！");
      break;
  case -120:
      alert("文件 ["+file.name+"] 大小异常！");
      break;
  case -130:
      alert("文件 ["+file.name+"] 类型不正确！");
      break;
     }
 },
 //检测FLASH失败调用
 'onFallback':function(){
     alert("您未安装FLASH控件，无法上传图片！请安装FLASH控件后再试。");
 },
 //上传到服务器，服务器返回相应信息到data里
 'onUploadSuccess':function(file, data, response){
     alert(data);
 }
    });
});

上传后台处理程序UploadHandler.ashx：大体上常用的我想也就这些，至于后端处理上传部分，我这里就不多讲了，和普通的文件上传处理方式是一样的。

 

/// 

    /// UploadHandler 的摘要说明
    /// 
    public class UploadHandler : IHttpHandler
    {
 public void ProcessRequest(HttpContext context)
 {
     try
     {
  context.Response.ContentType = "text/plain";
  //接收上传后的文件
  HttpPostedFile file = context.Request.Files["Filedata"];
  //其他参数
  //string somekey = context.Request["someKey"];
  //string other = context.Request["someOtherKey"];
  //获取文件的保存路径
  //string uploadPath = HttpContext.Current.Server.MapPath("UploadImages" + "\");
  string uploadPath = context.Request.Form["uploadPath"];
  //没有指定上传路径，则使用默认路径
  if (string.IsNullOrEmpty(uploadPath) || uploadPath == "")
  {
      uploadPath = string.Format("/upload/images/{0}/{1}/", DateTime.Now.Year, DateTime.Now.Month.ToString("D2"));
  }
  string fullUploadPath = HttpContext.Current.Server.MapPath(uploadPath);
  //判断上传的文件是否为空
  if (file != null)
  {
      if (!Directory.Exists(fullUploadPath))
      {
   Directory.CreateDirectory(fullUploadPath);
      }
      //文件名
      string _filename = context.Request.Form["uploadFileName"];
      //没有指定文件名，则生成一个随机文件名
      if (string.IsNullOrEmpty(_filename) || _filename == "")
      {
   DateTime _temDT = DateTime.Now;
   //扩展名
   string sExt = file.FileName.Substring(file.FileName.LastIndexOf(".")).ToLower();
   //生成随机数
   int digit = 6;
   Random _rnd = new Random();
   string rnd = _rnd.Next((int)Math.Pow(10, digit), (int)Math.Pow(10, digit + 1)).ToString();
   //文件名
   _filename = string.Format("{0}{1}{2}", _temDT.Ticks.ToString(), rnd, sExt);
      }
      //保存文件
      file.SaveAs(fullUploadPath + _filename);
      context.Response.Write(string.Format("{{"code":"1","msg":"上传成功","filePath":"{0}","fileName":"{1}"}}", uploadPath + _filename, _filename));
  }
  else
  {
      context.Response.Write("{{"code":"0","msg":"没有要上传的文件！"}}");
  }
     }
     catch (Exception ex)
     {
  context.Response.Write(string.Format("{{"code":"0","msg":"{0}"}}", ex.Message));
     }
     finally
     {
  context.Response.End();
     }
 }
 public bool IsReusable
 {
     get
     {
  return false;
     }
 }
    }