HTML5 drop event doesn't work unless dragover is handled

Neel Basu picture Neel Basu · Dec 7, 2011 · Viewed 24k times · Source

I am listening to the drop event and doing e.preventDefault() But its trying to open the dropped file. It was working fine till yesterday. But just today It broke for some unknown reason. I made a JsFiddle#bwquR/10 to reflect the Same.

Edit:

It looks like if you don't take the dragover event drop cannot be handled. even in the the fiddle If you comment the dragover It will not work.
In the actual work I missed the spelling of dragover But its still a question drop will not work without dragover

The fiddle was actually working but s the body was so small (only text DROP there). It was taking drop event only on that small area where DROP text lies not on the entire body. So I thought It was not working. Sorry for the confusion.

Answer

zuo picture zuo · Dec 7, 2011

I guess it is because that without dragOver event handler, default event handler of dragOver event is used, thus, no drop event is triggered after that. There is a need with e.preventDefault for dragOver event before drop event.