使用DataTransfer对象实现图片拖拽上传并预览效果

以下代码只能实现拖拽上传并预览图片功能，并不具备向后台传送file功能

html代码：

<fieldset>
                <legend>拖动上传文件</legend>
                <ul id="dropFile" οndrοp="dropFile(event)" οndragenter="return false" οndragοver="return false" style="height:300px;"></ul>
 </fieldset>

js代码：

function $$(id){
                return document.getElementById(id);
            }

//选择上传文件时调用的函数
            function moveFile(f){
                //检测浏览器是否支持FileReader对象
                if(typeof FileReader == "undefined"){
                    alert("你的浏览器不支持FileReader对象");
                }
                for(var intI=0;intI<f.length;intI++){
                    var tmpFile = f[intI];
                    var reader = new FileReader();
                    reader.readAsDataURL(tmpFile);
                    reader.οnlοad=(function(f1){
                        return function(e){
                            var eleSpan = document.createElement('span');
                            eleSpan.innerHTML = ['<img src="',e.target.result,'" title="',f1.name,'"/>'].join(' ');
                            $$("dropFile").insertBefore(eleSpan,null);
                        };
                    })(tmpFile);
                }
            }
            function dropFile(e){
                //调用预览上传文件的方式
                moveFile(e.dataTransfer.files);
                //停止事件的传播
                e.stopPropagation();
                //阻止事件的发生
                e.preventDefault();
                
            }