桌面圖片拖曳上傳 HTML5 File Api

<div id="dragBox" style="height:100px;width:200px;border:1px solid #a00;padding:10px;" >
   請拖曳圖片至此
</div>

function bindEvent(obj){
   $(obj).bind("dragover",ondragover);
   $(obj).bind("dragenter",ondragenter);
   $(obj).bind("dragleave",ondragleave);
   $(obj).get(0).addEventListener("drop", ondragdrop, false);
   //這裡不能用 JQuery bind drop event , 否則 event.dataTransfer 會抓不到
}

function ondragenter(){
   //變更div css 效果
   event.stopPropagation();
   event.preventDefault();
}

function ondragenter(){
   //變更div css 效果
   event.stopPropagation();
   event.preventDefault();
}

function ondragover(){
   event.stopPropagation();
   event.preventDefault();
}

function ondrop(event){
   event.stopPropagation();
   event.preventDefault();
   var dt = event.dataTransfer;
   var files = dt.files;
   
}

size = 71189
type = image/jpeg
//切割檔案 mozSlice(start,end);
mozSlice = function mozSlice() { [native code] }
name = Sunset.jpg
mozFullPath =

function getFiles(event){
   var dt = event.dataTransfer;
   var files = dt.files;
   var n = files.length;
   for (var i = 0; i < n; i++) {
   var file = files[i];
   var fileName=file.name;
        var reader = new FileReader();
        reader.readAsDataURL(file);
        reader.onloadend =function(event){
            var filedata = event.target.result;
            $(document.body).append("<img src='"+filedata+"' />")
        }
   }
}