HTML5 dataTransfer.files пуст при перетаскивании - PullRequest
Новая
       6

HTML5 dataTransfer.files пуст при перетаскивании

0 голосов
/ 27 января 2020

Я знаю, что этот вопрос задавался несколько раз ранее, но я не нашел решения, которое сработало, и я не понимаю, почему.

Я использую JQuery 3.0.0, и я пытался заставить работать перетаскивание, но каждый раз, когда я пытаюсь проверить список dataTransfer.files, он пуст. Там просто нет никаких файлов. Код: 

var $form = $(".drag-and-drop"); //drag and drop form (the dropzone)
var $input = $form.find('input[type="file"]'); //My input 
var filesToUpload = []; //Store the files in an array

$form.on('drag dragstart dragend dragover dragenter dragleave drop', function (e) {
        e.preventDefault();
        e.stopPropagation();
    }).on('dragover dragenter', function () {
        $form.addClass('is-dragover');
    }).on('dragover', function (e) {
        e.originalEvent.dataTransfer.dropEffect = "copy";
    }).on('dragleave dragend drop', function () {
        $form.removeClass('is-dragover');
    }).on('drop', function (e) {
        filesToUpload.push(e.originalEvent.dataTransfer.files);
        console.log(filesToUpload); //Empty
        console.log(JSON.stringify(event.dataTransfer.files[0].name)) //Error
    });

    $input.on('change', function (e) {
        filesToUpload.push(e.target.files); //This does work
    });

Кто-нибудь понимает, что я делаю неправильно, и как я могу убедиться, что мой список заполнен, чтобы я мог показать предварительный просмотр файла, который собирается загрузить?

~ Заранее спасибо ~

...