The code excerpted below works in IE/FF/Chrome/Safari/etc, but not in Opera. Opera gives a "Do you want to upload your files to www.webserver.edu?" dialog, but neither answering Yes or No seems to let the "drop" event fire. No errors are logged in the error console. Also, dragging other content (strings from the page) works as expected.
<input type="file" id="fileselect" name="fileselect" multiple="multiple">
<div id="filedrag">or drag files here</div>
...
$(document).ready(function() {
function DragDropEvent(e) {
e.stopPropagation();
e.preventDefault();
e.target.className = ((e.type == "dragover") ||
(e.type == "dragenter")) ? "hover" : "";
if (e.type == "drop") {
var files = (e.dataTransfer && e.dataTransfer.files);
if (files && files.length > 0) UploadFile(files);
}
}
function Init() {
var filedrag = document.getElementById("filedrag");
filedrag.addEventListener("dragenter", DragDropEvent, false);
filedrag.addEventListener("dragover", DragDropEvent, false);
filedrag.addEventListener("dragleave", DragDropEvent, false);
filedrag.addEventListener("drop", DragDropEvent, false);
}
if (window.File && window.FileList && window.FileReader) {
Init();
}
}
The code is actually fine as long as you have a reasonably new version of Opera.