2013-06-08 8 views
7

Ho trovato un javascript che si occupa dell'API del file reader HTML5. È scritto in puro javascript, sono in procinto di convertirlo in uno script jQuery. Ma mi sto bloccando a questo punto.Perché funziona questo semplice JavaScript ed è equivalente jQuery non riesce?

Questo funziona:

document.getElementById('drop-area').addEventListener('drop', function(e) { 
    e.preventDefault(); 
    e.stopPropagation(); 
    console.log(e.dataTransfer.files); // outputs the right stuff 
}, false); 

Questo fallisce:

$('#drop-area').on('drop', function(e) { 
    e.preventDefault(); 
    e.stopPropagation(); 
    console.log(e.dataTransfer.files); // ERROR: e.dataTransfer is undefined 
}); 

Che è una soluzione a questo problema?

+0

Se si dispone di codici equivalenti, perché non utilizzare semplicemente il JS puro perché è più veloce? – Markasoftware

+0

@Markasoftware il resto della mia app sta usando jQuery, ho piuttosto una base di codice uniforme. Anche parti di questo script coinvolgono la manipolazione DOM personalizzata che è molto più pulita/indolore da fare con jQuery, ovviamente. – TK123

+0

@ TK123 Se si desidera una base di codice uniforme, è sufficiente utilizzare JavaScript semplice. Dopotutto, anche l'operatore '+' è un semplice JavaScript, quindi usando jQuery sei incoerente. –

risposta

11

jQuery non normalizza la proprietà evento dataTransfer, per accedervi è necessario passare attraverso l'evento originale.

console.log(e.originalEvent.dataTransfer.files); 

È anche possibile impostare in modo che dataTransfer viene aggiunto l'oggetto evento jQuery nel modo seguente.

jQuery.event.props.push("dataTransfer"); 
Problemi correlati