Question

我正在尝试将文件拖放到firefox中并且正在采取宝宝步骤开始。现在，我只是想将一些文件拖入dropzone并获取已删除文件的列表。此时，我不想对这些文件做任何事情。

当我从finder到dropzone拖动一个文件（在这种情况下是一个图像，但同样的事情发生而不管文件类型）时，我可以看到dragenter和dragexit事件被触发。当我将文件放入dropzone时，drop事件不会触发。相反，浏览器会自动打开图像（例如，地址显示文件：//path/to/my/image.png）。

我的javascript看起来像这样：

  dropbox = document.getElementById("standard_file_dropzone");

  dropbox.addEventListener("dragenter", function(){console.log('standard enter');}, false);
  dropbox.addEventListener("dragexit", function(){console.log('standard exit');}, false);
  dropbox.addEventListener("dragover", $.noop, false);
  dropbox.addEventListener("drop", function ( event ) {
                                     console.log('standard dropped');
                                     event.stopPropagation();
                                     event.preventDefault();

                                     if(( typeof event.dataTransfer.files !== 'undefined' ) &&
                                        ( event.dataTransfer.files.length > 0 )) {
                                       console.dir( event.dataTransfer.files );

                                     }
                                     return false;
                                   }, false);

我的HTML看起来像这样：

    <div id="standard_file_dropzone" style="height:150px; width:150px; border:solid;">
      Standard Drop Files Here
    </div>

所以我想知道我在这里做错了什么？上面的代码似乎没有任何错误（至少对我来说很明显）。 dragenter / exit事件正在解雇，为什么不是drop事件？为什么浏览器会尝试自己打开文件？

有一点需要注意，当我在Chrome中打开我的页面时，这是按预期工作的，因此这是Firefox特有的问题。

日Thnx，克里斯托弗

Answer 1

问题是使用$ .noop作为dragover处理程序。用一个实际停止传播和冒泡的功能替换它，它开始按预期工作。

我有时会这么白痴。：P

文件拖动;放入Firefox（v10）

1 个答案: