jQuery文件上传与拖放提交空文件输入答案

【问题标题】：jQuery fileupload with drag&drop submits empty file inputjQuery文件上传与拖放提交空文件输入
【发布时间】：2014-07-24 09:47:26
【问题描述】：

我正在使用 jQuery fileupload 插件，它在通过单击文件输入并通过浏览器对话框进行选择来上传文件时效果很好。

但是当使用拖放时，它似乎提交了一个空文件输入

------WebKitFormBoundaryCA4VuYwsPr7h4ItR
Content-Disposition: form-data; name="attachment"; filename=""
Content-Type: application/octet-stream

虽然文件上传的 add 回调中的数据对象在调用 data.submit() 之前确实有一个文件

files: Array[1]
  0: File
    lastModifiedDate: Tue Mar 18 2014 13:29:07 GMT+0100 (CET)
    name: "17_1395143728_0.png"
    size: 13542
    tempID: 1
    type: "image/png"
    webkitRelativePath: ""
    __proto__: File
  length: 1

有人知道为什么会这样吗？

编辑：代码：

$(document).bind('drop.fileUpload', function (e) {
    if(jQuery(e.target).attr('id') !== 'dropZone'){
        return;
    }

    var fileInput = jQuery('#attachment');
    var files = e.originalEvent.dataTransfer.files;

    if (fileInput.length && files.length) {
        jQuery('#dropZone').hide();
        fileInput.fileupload('add', {files: files});

        e.preventDefault();
    }
});

jQuery('.js_toggleFileupload').fileupload({
    autoUpload: true,
    forceIframeTransport: true,
    progressInterval: 50,
    url: '/xhr',
    add: function (e, data) {

        console.debug(data); // this is where the data object has files

        var jqXHR = data.submit().done(function (e, data) { // this is where an empty file input is submitted
            //stuff happens here
        }
    }
});

【问题讨论】：

请添加您的javascript代码。

标签： javascript jquery file-upload

【解决方案1】：

天啊！问题是同时使用 iframeTransport 和拖放，由于 iframeTransport 选项将文件输入发布到 iframe，因此无法正常工作。在拖放的情况下，文件输入具有空值。

我已经关闭了 forceIframeTransport 选项，现在它可以工作了。

【讨论】：