jQuery.on("drop") not firing
You need to cancel all events
$("html").on("dragover", function(event) { event.preventDefault(); event.stopPropagation(); $(this).addClass('dragging');});$("html").on("dragleave", function(event) { event.preventDefault(); event.stopPropagation(); $(this).removeClass('dragging');});$("html").on("drop", function(event) { event.preventDefault(); event.stopPropagation(); alert("Dropped!");});
In addition to Christian's solution this can be shortened to:
$('#my-dropzone') // crucial for the 'drop' event to fire .on('dragover', false) .on('drop', function (e) { // do something return false; });