HTML5文件实现拖拽上传

window.onload = function(){
var uuz = document.getElementById('fileSpan');

uuz.ondragenter = function(e){
e.preventDefault();
}

uuz.ondragover = function(e){
e.preventDefault();
this.innerHTML = '请松开';
}

uuz.ondragleave = function(e){
e.preventDefault();
this.innerHTML = '请拖入要上传的文件';
}

uuz.ondrop = function(e){
e.preventDefault();

var upfile = e.dataTransfer.files[0]; //获取要上传的文件对象(可以上传多个)
var formdata = new FormData();
var xhr = new XMLHttpRequest();
formdata.append('upfile', upfile); //设置服务器端接收的name为upfile
xhr.open("post","fileResume.do?method=uploadResumeFile&uploadType="+dragType);
xhr.onreadystatechange = function(){
if(this.readyState==4){
if(this.status==200){ //上传成功
var resultText = this.responseText;
console.info(resultText);
//转json
var jsonObj = JSON.parse(resultText);
console.info(jsonObj);
if(jsonObj.success){
//生成input表单
var fileId = createInput(jsonObj.uuid);
//生成显示名称
appendFile1(fileId,upfile.name);
}
}else{
alert('上传失败,请使用另一种方式上传');
}
}
}

xhr.send(formdata);
}
}