Шаблон модуля JavaScript и API перетаскивания

Question

У меня есть пример модуля в js, который, как предполагается, управляет загрузкой файлов Drag and Drop. Код, похоже, работает для функции события «dragenter», но когда я удаляю файл, а событие «drop» должно вызывать функцию сброса, код всегда пересылается в путь к файлу.

Вот пример кода

var testModule = (function testBuilder(){ 
    function call(evt) { 
     evt.preventDefault(); 
     console.log('works'); 
    } 

    function dropped(evt) { 
     evt.preventDefault(); 
     console.log('file dropped'); 
    } 

    var element = document.getElementById('testBlock'); 

    function init() { 
     element.addEventListener('dragenter', call, false); 
     element.addEventListener('drop', dropped, false); 
    } 

    publicAPI = { 
     init: init 
    }; 

    return publicAPI; 
})(); 

window.onload = function() { 
    testModule.init(); 
}; 

и jsbin здесь https://jsbin.com/redixucate/edit?js,console,output

Если кто-то может понять, почему он держит перенаправлять путь к файлу, я бы Rly оценить его.

Answer 1

Добавить событие 'dragover' с предупреждениемDefault, и оно должно работать.

Внутри вашего Init():

element.addEventListener('dragover', over, false); 

и над функцией:

function over(e) { 
    e = e || window.event; 
    if(e.preventDefault) { 
    e.preventDefault(); 
    } 
} 

добавить также и тот же предупреждение на другие две функции ..

См https://jsbin.com/xemovariwu/1/edit?js,console,output

Также см. this вопрос/ответ.