Javascript 将拖放文件发送到输入类型文件元素

我有一个表单生成器，我想添加拖放文件功能

我陷入困境的是，我遇到的所有资源都是在删除时通过

xhr

上传图像的。我希望图像一直保存到表单提交

理想情况下，

事件.dataTransfer.files[0]

对象将被传输到

元素

---

目前我无法做到这一点。它们是否使用兼容的数据类型？

您可以在发生drop事件后创建并发送一个表单，然后用户单击conf按钮。要点如下：（未经测试）

---

为什么使用XHR会有问题？只需在表单提交后发送请求，或者通过ajax提交整个表单和文件。阅读更多信息。我的理解是FormData不能很好地与旧版（8-9）IE配合使用。我错了吗？这是真的（那些浏览器中不存在FormData），但不相关，因为你无论如何都不能在那些浏览器中通过拖放上传文件。我希望通过普通的$u POST发送，但我可能不得不切换到xhr选项。谢谢回复。这将发送一个POST请求。就您的服务器而言，表单提交和使用XHR通过POST发送的FormData对象之间没有区别。这并不能真正回答问题。我希望能够通过通常的文件输入或拖放到自定义区域上传文件。在任何情况下，表单都有几个输入字段，而文件输入只是其中的一个，因此我想用传统的方式一次提交整个表单：通过简单的表单提交。

function uploadFile(file) {
    var form = new FormData(),
        xhr = new XMLHttpRequest();

    form.append('media', file);
    xhr.open('POST', '/myurl/');

    xhr.onprogress = function(e) {
        showProgress();
    }

    xhr.onload = function(e) {
        showSuccessConf();
    }

    xhr.send(form);
}

uploadFile(event.dataTransfer.files[0]);