将文件夹上传到没有库的 jQuery 中

drag and drop folder upload in jquery without library

本文关键字:jQuery 文件夹      更新时间:2023-09-26

>我已经像这样编写了正常的多文件拖放上传器,

.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)

对于 Chrome>= 21,它将起作用 Chrome 21 拖放