在没有库的jquery中拖放文件夹上传

Question

我已经写了这样的普通多文件拖放上传器，

HTML：

<div class="drop-box drop-area">
    <form enctype="multipart/form-data" id="yourregularuploadformId">
        <input type="file" name="files[]" multiple="multiple" class="hidden">        
    </form>
</div>

脚本：

$('.drop-area').on(
            'drop',
            function (e) {
                e.preventDefault();
                e.stopPropagation();
                if (e.originalEvent.dataTransfer) {
                    if (e.originalEvent.dataTransfer.files.length) {
                     processFileUpload(e.originalEvent.dataTransfer.files);
                    }
                }
            }
    );

function processFileUpload(droppedFiles) {
        var uploadFormData = new FormData($("#yourregularuploadformId")[0]);
        if (droppedFiles.length > 0) { 
            for (var f = 0; f < droppedFiles.length; f++) { 
                uploadFormData.append("files[]", droppedFiles[f]); 
            }
        }

$.ajax({
 url: "files.php",
            type: "POST",
            data: uploadFormData,
            cache: false,
            contentType: false,
            processData: false,
            success: function (ret) {
               alert("file uploaded !");
            },
});
}

我也必须上传文件夹，嵌套文件夹（目录）。这个怎么做 ？有人得到这个。这是可能的。我不需要使用库来做到这一点。 （IE10 应该可以）

Answer 1

对于 Chrome >= 21，它可以工作Chrome 21 Drag and Drop