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

我肯定会收到拖放事件，但是问题出在preventDefault上，如果我拖放图像或文件，它将在浏览器中打开。不知道我在这里想念什么。

谢谢

Answer 1

event.preventDefault();功能中也只需要dragover

文件上传拖放问题

1 个答案: