怎么样在MVC中基于Ajax和HTML5实现文件上传功能？

<div id="FormContent">
    <form id="FormUpload"
    enctype="multipart/form-data" method="post">
     <span class="btn btn-success fileinput-button">
      <i class="glyphicon glyphicon-plus"></i>
      <span>Add files...</span>
      <input type="file"
      name="UploadedFile" id="UploadedFile" />
     </span>
     <button class="btn btn-primary start"
     type="button" id="Submit_btn">
      <i class="glyphicon glyphicon-upload"></i>
      <span>Start upload</span>
     </button>
     <button class="btn btn-warning cancel"
     type="button" id="Cancel_btn">
      <i class="glyphicon glyphicon-ban-circle"></i>
      <span>close</span>
     </button>
    </form>
    <div class="progress CustomProgress">
     <div id="FileProgress"
     class="progress-bar" role="progressbar"
   aria-valuenow="" aria-valuemin=""
   aria-valuemax="" style="width %;">
      <span></span>
     </div>
    </div>
    <div class="InfoContainer">
     <div id="Imagecontainer"></div>
     <div id="FileName" class="info">
     </div>
     <div id="FileType" class="info">
     </div>
     <div id="FileSize" class="info">
     </div>
    </div>
   </div>

 function singleFileSelected(evt) {
   //var selectedFile = evt.target.files can use this or select input file element 
   //and access it's files object
   var selectedFile = ($("#UploadedFile"))[].files[];//FileControl.files[];
   if (selectedFile) {
    var FileSize = ;
    var imageType = /image.*/;
    if (selectedFile.size > ) {
     FileSize = Math.round(selectedFile.size * / ) / + " MB";
   }
   else if (selectedFile.size > ) {
    FileSize = Math.round(selectedFile.size * / ) / + " KB";
   }
   else {
    FileSize = selectedFile.size + " Bytes";
   }
   // here we will add the code of thumbnail preview of upload images
   
   $("#FileName").text("Name " + selectedFile.name);
   $("#FileType").text("type " + selectedFile.type);
   $("#FileSize").text("Size " + FileSize);
  }
 }

 if (selectedFile.type.match(imageType)) {
    var reader = new FileReader();
    reader.onload = function (e) {
     $("#Imagecontainer").empty();
     var dataURL = reader.result;
     var img = new Image()
     img.src = dataURL;
     img.className = "thumb";
     $("#Imagecontainer").append(img);
    };
    reader.readAsDataURL(selectedFile);
   }

function UploadFile() {
   //we can create form by passing the form to Constructor of formData object
   //or creating it manually using append function 
   //but please note file name should be same like the action Parameter
   //var dataString = new FormData();
   //dataString.append("UploadedFile", selectedFile);
  
   var form = $('#FormUpload')[];
   var dataString = new FormData(form);
  $.ajax({
   url '/Uploader/Upload', //Server script to process data
   type 'POST',
   xhr function () { // Custom XMLHttpRequest
    var myXhr = $.ajaxSettings.xhr();
    if (myXhr.upload) { // Check if upload property exists
     //myXhr.upload.onprogress = progressHandlingFunction
     myXhr.upload.addEventListener('progress', progressHandlingFunction, 
     false); // For handling the progress of the upload
    }
    return myXhr;
   },
   //Ajax events
   success successHandler,
   error errorHandler,
   completecompleteHandler,
   // Form data
   data dataString,
   //Options to tell jQuery not to process data or worry about content-type.
   cache false,
   contentType false,
   processData false
  });
 }

function progressHandlingFunction(e) {
   if (e.lengthComputable) {
    var percentComplete = Math.round(e.loaded * / e.total);
    $("#FileProgress").css("width", 
    percentComplete + '%').attr('aria-valuenow', percentComplete);
    $('#FileProgress span').text(percentComplete + "%");
   }
   else {
    $('#FileProgress span').text('unable to compute');
  }
 }

 public JsonResult Upload(HttpPostedFileBase uploadedFile)
    {
     if (uploadedFile != null && uploadedFile.ContentLength > )
     {
      byte[] FileByteArray = new byte[uploadedFile.ContentLength];
      uploadedFile.InputStream.Read(FileByteArray, , uploadedFile.ContentLength);
      Attachment newAttchment = new Attachment();
     newAttchment.FileName = uploadedFile.FileName;
     newAttchment.FileType = uploadedFile.ContentType;
     newAttchment.FileContent = FileByteArray;
     OperationResult operationResult = attachmentManager.SaveAttachment(newAttchment);
     if (operationResult.Success)
     {
      string HTMLString = CaptureHelper.RenderViewToString
      ("_AttachmentItem", newAttchment, this.ControllerContext);
      return Json(new
      {
       statusCode = ,
       status = operationResult.Message,
       NewRow = HTMLString
      }, JsonRequestBehavior.AllowGet);
     }
     else
     {
      return Json(new
      {
       statusCode = ,
       status = operationResult.Message,
       file = uploadedFile.FileName
      }, JsonRequestBehavior.AllowGet);
     }
    }
    return Json(new
    {
     statusCode = ,
     status = "Bad Request! Upload Failed",
     file = string.Empty
    }, JsonRequestBehavior.AllowGet);
   }

 <div id="drop_zone">Drop images Here</div>

 function MultiplefileSelected(evt) {
   evt.stopPropagation();
   evt.preventDefault();
   $('#drop_zone').removeClass('hover');
   selectedFiles = evt.target.files || evt.dataTransfer.files;
   if (selectedFiles) {
    $('#Files').empty();
    for (var i = ; i < selectedFiles.length; i++) {
     DataURLFileReader.read(selectedFiles[i], function (err, fileInfo) {
     if (err != null) {
      var RowInfo = '<div id="File_' + i + '" 
      class="info"><div class="InfoContainer">' +
          '<div class="Error">' + err + '</div>' +
          '<div data-name="FileName" 
          class="info">' + fileInfo.name + '</div>' +
          '<div data-type="FileType" 
          class="info">' + fileInfo.type + '</div>' +
          '<div data-size="FileSize" 
          class="info">' + fileInfo.size() + 
          '</div></div><hr/></div>';
      $('#Files').append(RowInfo);
     }
     else {
      var image = '<img src="' + fileInfo.fileContent + 
      '" class="thumb" title="' + 
      fileInfo.name + '" />';
      var RowInfo = '<div id="File_' + i + '" 
      class="info"><div class="InfoContainer">' +
          '<div data_img="Imagecontainer">' + 
          image + '</div>' +
          '<div data-name="FileName" 
          class="info">' + fileInfo.name + '</div>' +
          '<div data-type="FileType" 
          class="info">' + fileInfo.type + '</div>' +
          '<div data-size="FileSize" 
          class="info">' + fileInfo.size() + 
          '</div></div><hr/></div>';
      $('#Files').append(RowInfo);
     }
    });
   }
  }
 }

 var DataURLFileReader = {
   read function (file, callback) {
    var reader = new FileReader();
    var fileInfo = {
     name file.name,
     type file.type,
     fileContent null,
     size function () {
      var FileSize = ;
     if (file.size > ) {
      FileSize = Math.round(file.size * / ) / + " MB";
     }
     else if (file.size > ) {
      FileSize = Math.round(file.size * / ) / + " KB";
     }
     else {
      FileSize = file.size + " bytes";
     }
     return FileSize;
    }
   };
   if (!file.type.match('image.*')) {
    callback("file type not allowed", fileInfo);
    return;
   }
   reader.onload = function () {
    fileInfo.fileContent = reader.result;
    callback(null, fileInfo);
   };
   reader.onerror = function () {
    callback(reader.error, fileInfo);
   };
   reader.readAsDataURL(file);
  }
 };

 function handleDragOver(evt) {
   evt.preventDefault();
   evt.dataTransfer.effectAllowed = 'copy';
   evt.dataTransfer.dropEffect = 'copy';
  }

  function UploadMultipleFiles() {
   // here we will create FormData manually to prevent sending mon image files
   var dataString = new FormData();
   //var files = document.getElementById("UploadedFiles").files;
   for (var i = ; i < selectedFiles.length; i++) {
    if (!selectedFiles[i].type.match('image.*')) {
     continue;
    }
   }
 // AJAX Request code here
 }

<system.webServer>
   <security>
      <requestFiltering>
        <requestLimits maxAllowedContentLength="" />
      </requestFiltering>
   </security>
  </system.webServer>
  <httpRuntime targetFramework="." maxRequestLength=""/>