Question

我正在尝试使用以下代码为Drag and drop a folder onto Chrome (v46)创建PoC，但alert未被触发。删除文件夹时Chrome会切换到文件夹浏览器视图，或者在删除文件时打开拖动的文件。基本上它保持默认行为。我试图打开像“http://localhost/index.html”和“file：/// C：\ index.html”这样的html文件，但两者的行为都相同。

我哪里错了？

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Drop File/Folder</title>
</head>
<body>
    <div id="dropzone" style="border: solid 1px; padding: 200px;">Drop files or folders here</div>

    <script type="text/javascript">
        var dropzone = document.getElementById('dropzone');

        dropzone.ondrop = function (e) {
            alert("dropped!");
            e.preventDefault();
        };

        // I also tried this but no success
        //dropzone.addEventListener('drop', function (e) {
        //    alert("dropped!");
        //    e.preventDefault();
        //});
    </script>
</body>
</html>

Answer 1

事实证明你需要添加一个dragover处理程序。

dropzone.ondragover = function (e) {
    e.preventDefault();
};

Chrome拖放文件/文件夹无效

1 个答案: