Comment utiliser l’événement drop de jQuery pour télécharger des fichiers déplacés depuis le bureau?

Est-il possible d’utiliser l’événement drop de jQuery pour faire glisser des fichiers depuis le bureau?

Si oui, comment puis-je obtenir les données de fichier supprimées?

C’est un peu désordonné (vous devez gérer au moins 3 événements) mais possible.

Tout d’abord, vous devez append des gestionnaires d’événements pour le dragoverdragenter et le dragoverdragenter et empêcher les actions par défaut pour ces événements comme ceci:

 $('#div').on( 'dragover', function(e) { e.preventDefault(); e.stopPropagation(); } ) $('#div').on( 'dragenter', function(e) { e.preventDefault(); e.stopPropagation(); } ) 

Vous pouvez ensuite append le gestionnaire de repository et accéder aux fichiers supprimés avec e.originalEvent.dataTransfer.files :

 $('#div').on( 'drop', function(e){ if(e.originalEvent.dataTransfer && e.originalEvent.dataTransfer.files.length) { e.preventDefault(); e.stopPropagation(); /*UPLOAD FILES HERE*/ upload(e.originalEvent.dataTransfer.files); } } ); 

Vous pouvez maintenant faire glisser des fichiers depuis le bureau / explorer / finder dans le div et y accéder.

http://jsfiddle.net/fSA4N/5/