how to do document.ondrop in firefox?

firefox, google-chrome, html, javascript

Solution

Assuming the original javascript looks like this and works in Chrome:

document.ondrop=function(event){
    alert("hello");
}

It can be changed to work in both Firefox and Chrome. Firefox requires you to stop the default action from occuring when you drag a file over, which can be solved by using the ondragover event. The following javascript code will also work in Firefox:

document.ondragover = function(event){
    event.preventDefault();
}
document.ondrop=function(event){
    alert("hello");
}

I found this solution by looking at w3schools and looking for the differences between their simple example and your code.

From html5rocks on slide #18 there is also an html5 example of another way to use drag and drop by adding the listener to the page.

Problem

The document.ondrop seems to work in chrome, but not in firefox? Attached is an example: http://auth.letschat.info/test2.php If you drop a file on to the page it should pop up an alert box. However it doesn't work in firefox, but does in chrome. When I use firefox console the document.ondrop handler is correctly set.

Original source