拖拽文件至浏览器实现图片上传功能

实现拖拽文件至浏览器实现图片上传功能。

直接上代码

 var outer = document.creatElement("div");

outer.addListener('dragleave', function (evt) {

evt.stopPropagation();
evt.preventDefault();
});

outer.addListener('dragover', mxUtils.bind(this, function (evt) {
    evt.stopPropagation();
evt.preventDefault();
}));

outer.addListener('drop', mxUtils.bind(this, function (evt) 
    if (evt.dataTransfer.files.length > 0) {
    // 获取文件
var file = evt.dataTransfer.files[0];

    // 构造文件读取
var reader = new FileReader();
var formdata = new FormData();
formdata.append("projectId", urlParams["projectId"]);
formdata.append("imgPathFile", file);
formdata.append("name", file.name);
     // 读取文件
reader.readAsDataURL(file);
    
imgArr.push(formdata);
reader.onload = function(evt) {
// 加载图片
}
}
evt.stopPropagation();
evt.preventDefault();
}), false);
原文地址:https://www.cnblogs.com/bigharbour/p/14491161.html