在Firefox中的文件拖放（v10）

我试图让文件拖放在Firefox中，并正在采取婴儿的步骤开始。现在，我只是试图拖动一些文件到一个dropzone并获取文件的列表。在这一点上，我不想对这些文件做任何事情。在Firefox中的文件拖放（v10）

当我从发现者拖放一个文件（在这种情况下是一个图像，但不管文件类型如何），我可以看到dragenter和dragexit事件触发。当我将文件放入dropzone时，放置事件不会触发。相反，浏览器会自行打开图像（例如，地址显示file：//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，克里斯托夫

来源

2012-06-11 Christoph

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

有时候我真是个白痴。：p

来源

2012-06-11 17:30:03 Christoph

这的确行得通，但我不清楚为什么这很明显？ – Mark

@Christoph我正面临着同样的问题，你可以在相同的帮助。 –

在Firefox中的文件拖放（v10）

回答

相关问题