Estoy intentando implementar arrastrar y soltar archivos desde el escritorio a la ventana del navegador. He usado jQuery para adjuntar tres eventos al elemento HTML como se muestra en el siguiente código:

$("html").on("dragover", function() {
    $(this).addClass('dragging');
});

$("html").on("dragleave", function() {
    $(this).removeClass('dragging');
});

$("html").on("drop", function(event) {
    event.preventDefault();  
    event.stopPropagation();
    alert("Dropped!");
});

Los eventos 'dragover' y 'dragleave' funcionan bien, mostrando un borde de recuadro alrededor de toda la página cuando arrastro un archivo sobre una eliminación si lo arrastro de nuevo.

Sin embargo, el evento 'drop' no parece dispararse en absoluto, el archivo dropeado simplemente se abre en la ventana del navegador.

¿Alguien tiene alguna idea de por qué este evento no se está disparando?

Por cierto, estoy probando esto en la última versión de Chrome y utilizando jQuery 1.10.2.