I am trying to drag and drop a file in firefox and I am starting to do baby steps. Right now I'm just trying to drag and drop some files into dropzone and get a list of deleted files. At the moment, I do not want to do anything with the files.
When I drag a file (in this case, the image, but the same thing happens regardless of the file type) from the finder to dropzone, I can see the dragenter and dragexit shooting. When I drop the file into dropzone, the drop event does not fire. Instead, the browser opens its own image (for example, the address shows the file: //path/to/my/image.png).
My javascript looks like this:
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);
My HTML looks like this:
<div id="standard_file_dropzone" style="height:150px; width:150px; border:solid;">
Standard Drop Files Here
</div>
, ? , ( ) . dragenter/exit , drop? ?
, Chrome, , , Firefox.
Thnx,
Christoph