ajax图片上传

使用ajaxfileupload.js插件

html代码：

  <p>
     <label>ajax上传</label>
     <input type="file" name="fileToUpload" id="fileToUpload" class="inp_fileToUpload" multiple="multiple"/>
     <img src="$web.site$web.tpl#**#adminht/images/lb_head.jpg" width="30px" height="30px" class="img_upload" id="img" />
    </p>
    <p>
     <label>最新修改人员：</label>
     <input readonly="readonly" type="text" size="" />
    </p>
    <div>

     <script type="text/javascript">
      $(function() {
       $(".inp_fileToUpload").live("change", function() {//现在这个已经适用于多个file表单。
        ajaxFileUpload($(this).attr("id"), $(this).parent().children(".img_upload").attr("id"));
       })
      })
      function ajaxFileUpload(file_id, img_id) {
       jQuery.ajaxFileUpload({
        url : '/upload/upload_json.ashx', //用于文件上传的服务器端请求地址
        secureuri : false, //是否需要安全协议，一般设置为false
        fileElementId : file_id, //文件上传域的ID
        dataType : 'json', //返回值类型 一般设置为json
        success : function(data, status)//服务器成功响应处理函数
        {
         if (data.error == ) {
          $("#" + img_id).attr("src", data.url);
         } else {
          alert(data.message);
         }
        },
        error : function(data, status, e)//服务器响应失败处理函数
        {
         alert(e);
        }
       })
       return false;
      }
     </script>
    </div>
   </div>

文件上传后台处理代码（asp.net版）

 <%@ webhandler Language="C#" class="Upload" %>

 using System;
 using System.Collections;
 using System.Web;
 using System.IO;
 using System.Globalization;
 using LitJson;
 public class Upload : IHttpHandler
 {
  private HttpContext context;
  public void ProcessRequest(HttpContext context)
  {
   String aspxUrl = context.Request.Path.Substring(, context.Request.Path.LastIndexOf("/") + );

   //文件保存目录路径
   String savePath = "attached/";
   //文件保存目录URL
   String saveUrl = aspxUrl + "attached/";
   //定义允许上传的文件扩展名
   Hashtable extTable = new Hashtable();
   extTable.Add("image", "gif,jpg,jpeg,png,bmp");
   extTable.Add("flash", "swf,flv");
   extTable.Add("media", "swf,flv,mp3,wav,wma,wmv,mid,avi,mpg,asf,rm,rmvb");
   extTable.Add("file", "doc,docx,xls,xlsx,ppt,htm,html,txt,zip,rar,gz,bz2");
   //最大文件大小
   int maxSize = ;
   this.context = context;
   HttpPostedFile imgFile = context.Request.Files["imgFile"];
   if (imgFile == null)
   {
    showError("请选择文件。");
   }
   String dirPath = context.Server.MapPath(savePath);
   if (!Directory.Exists(dirPath))
   {
    showError("上传目录不存在。");
   }
   String dirName = context.Request.QueryString["dir"];
   if (String.IsNullOrEmpty(dirName)) {
    dirName = "image";
   }
   if (!extTable.ContainsKey(dirName)) {
    showError("目录名不正确。");
   }
   String fileName = imgFile.FileName;
   String fileExt = Path.GetExtension(fileName).ToLower();
   if (imgFile.InputStream == null || imgFile.InputStream.Length > maxSize)
   {
    showError("上传文件大小超过限制。");
   }
   if (String.IsNullOrEmpty(fileExt) || Array.IndexOf(((String)extTable[dirName]).Split(','), fileExt.Substring().ToLower()) == -)
   {
    showError("上传文件扩展名是不允许的扩展名。\n只允许" + ((String)extTable[dirName]) + "格式。");
   }
   //创建文件夹
   dirPath += dirName + "/";
   saveUrl += dirName + "/";
   if (!Directory.Exists(dirPath)) {
    Directory.CreateDirectory(dirPath);
   }
   String ymd = DateTime.Now.ToString("yyyyMMdd", DateTimeFormatInfo.InvariantInfo);
   dirPath += ymd + "/";
   saveUrl += ymd + "/";
   if (!Directory.Exists(dirPath)) {
    Directory.CreateDirectory(dirPath);
   }
   String newFileName = DateTime.Now.ToString("yyyyMMddHHmmss_ffff", DateTimeFormatInfo.InvariantInfo) + fileExt;
   String filePath = dirPath + newFileName;
   imgFile.SaveAs(filePath);
   String fileUrl = saveUrl + newFileName;
   Hashtable hash = new Hashtable();
   hash["error"] = ;
   hash["url"] = fileUrl;
   context.Response.AddHeader("Content-Type", "text/html; charset=UTF-8");
   context.Response.Write(JsonMapper.ToJson(hash));
   context.Response.End();
  }
  private void showError(string message)
  {
   Hashtable hash = new Hashtable();
   hash["error"] = ;
   hash["message"] = message;
   context.Response.AddHeader("Content-Type", "text/html; charset=UTF-8");
   context.Response.Write(JsonMapper.ToJson(hash));
   context.Response.End();
  }
  public bool IsReusable
  {
   get
   {
    return true;
   }
  }
 }