differenza tra event.originalEvent.dataTransfer.files e event.dataTransfer.files in HTML 5

Question

Qual è la differenza tra

event.originalEvent.dataTransfer.files 

e

event.dataTransfer.files 

???

Perché nel trascinamento, il secondo codice non funziona ed è indefinito e ho dovuto usare il primo codice perché funziona!

Answer 1

jQuery non passa l'oggetto evento del browser, passa il numero jQuery event object. È possibile accedere all'oggetto evento originale non toccato dalla proprietà .originalEvent nell'oggetto evento jQuery. Quindi puoi procedere normalmente.

Così in codice:

jQuery modello di eventi:

$(document).on("drop dragend dragstart dragenter dragleave drag dragover", function(event) { 
    event.preventDefault(); 
    if (event.type === "drop") { 
     alert(event.originalEvent.dataTransfer.files); 
    } 
}); 

W3C modello di eventi:

function preventDefault(event) { 
    event.preventDefault(); 
} 

function alertFiles(event) { 
    alert(event.dataTransfer.files); 
} 
document.addEventListener("dragstart", preventDefault, false); 
document.addEventListener("dragenter", preventDefault, false); 
document.addEventListener("dragleave", preventDefault, false); 
document.addEventListener("drag", preventDefault, false); 
document.addEventListener("dragend", preventDefault, false); 
document.addEventListener("dragover", preventDefault, false); 
document.addEventListener("drop", preventDefault, false); 
document.addEventListener("drop", alertFiles, false);