проблема перетаскивания при загрузке файла

Question

Я подписан на HTML

<div class="upload_file" id="dropArea">
    <form class="box row center" method="post" action="" enctype="multipart/form-data">
        <div class="box_input column center">
            <p class="title">BROWSE DATA FILE</p>
            <span class="icon-upload_file"></span>
            <input class="box_file" type="file" name="data" id="data" />
            <label for="data" class="column center">
                <p class="title">CHOOSE A FILE</p>
                <p class="subtitle">or drag and drop it</p>
            </label>
        </div>
    </form>
</div>

и связанный с ним javascript

let dropArea = document.getElementById('dropArea');

dropArea.addEventListener('dragover', function(event){
    console.log(event.type); // works
}, false)

dropArea.addEventListener('drop', function(event){
    event.preventDefault(); // opens the file in the browser
    event.stopPropagation();
}, true);

Я точно получаю событие перетаскивания 'over', но проблема в предотвращении, если яперетащите изображение или файл, он открывается в браузере.не уверен, что мне здесь не хватает.

Спасибо,

Answer 1

Вам просто нужно event.preventDefault(); также в функции dragover