Tengo una aplicación que almacena archivos y usa arrastrar y soltar para subirlos. ¿Hay alguna manera de arrastrar y soltar para descargar el archivo a mi escritorio en lugar de tener que hacer clic en "descargar". Básicamente, lo opuesto a la carga de arrastrar y soltar.¿Es posible arrastrar y soltar un archivo del navegador al escritorio, causando una descarga?
Respuesta
No, necesitaría poder establecer una ruta de descarga, si nada más, que ningún explorador le permite hacer. Es posible con un complemento, pero no JS directo.
Pregunta de seguimiento: ¿sugeriría un complemento de navegador para lograr esto, lo que significa que tendría que crear un complemento para cada navegador? o algún tipo de integración de escritorio? –
No recomendaría intentarlo, para ser honesto. Es un comportamiento no estándar y nadie lo intentará a menos que les dé instrucciones. Sí, necesitaría un complemento diferente en cada navegador. –
Falso: es (ahora) posible hacer esto. Chrome tiene un método (ver la respuesta a continuación) y parece que Firefox requiere una extensión (http://superuser.com/questions/758797/downloading-files-with-drag-and-drop) – Abacus
Solo es compatible con Google Chrome.
http://www.html5rocks.com/en/tutorials/dnd/basics/#toc-desktop-dnd-out Por ejemplo, está implementado en Gmail.
Ninguno de los navegadores cumple este comportamiento.
Los html5rocks y cssninja están bien, pero creo que son excesivos para las respuestas rápidas. Aquí hay un ejemplo simple de usar eventos de arrastrar de algo, incluso para descargar archivos.
<style>
div { background-color: #eee; border: 1px solid black; padding: 5px; float: left; clear: both; }
</style>
<div id="uiLinkText" draggable="true">Drag <b>Text</b> to a text editor </div>
<div id="uiLinkHyperlink" draggable="true">Drag <b>Hyperlink</b> to address bar </div>
<div id="uiLinkUrlDownload" draggable="true">Drag <b>Url Download</b> to file system </div>
<div id="uiLinkStaticDownload" draggable="true">Drag <b>Static Download</b> to file system </div>
<script>
document.getElementById('uiLinkText').ondragstart = function(event){
// plain text, for dropping into text editor
event.dataTransfer.setData('text/plain', 'Go to http://stackoverflow.com/questions/5411481/ to read about this.');
}
document.getElementById('uiLinkHyperlink').ondragstart = function(event){
// URL, for dropping into the browser's address bar
event.dataTransfer.setData('text/uri-list', 'http://stackoverflow.com/questions/5411481/');
}
document.getElementById('uiLinkUrlDownload').ondragstart = function(event){
// file download contents, for dropping into a file system
event.dataTransfer.setData('DownloadURL', 'text/plain:SourceQuestion.html:http://stackoverflow.com/questions/5411481/')
}
document.getElementById('uiLinkStaticDownload').ondragstart = function(event){
var textToWrite = 'file contents here';
var textFileAsBlob = new Blob([textToWrite], { type: 'text/xml' });
var url = window.URL.createObjectURL(textFileAsBlob);
// file download contents, for dropping into a file system
event.dataTransfer.setData('DownloadURL', 'text/plain:Static.txt:' + url)
}
</script>
Advertencia: Si bien esto funcionó bien para mí en Chrome localmente (en Windows 7), cuando traté de ponerlo en jsFiddle para un Linke, el "Descargar estático" no funcionó, y el "URL de descarga" se estrelló Google Chrome.
Como con la mayoría de arrastrar y soltar, no funciona con MSIE 9, no he probado 10+ o Firefox.
- 1. Arrastre un archivo del navegador al escritorio
- 2. ¿Es posible arrastrar y soltar contenido entre dos ventanas del navegador usando JQuery u otro método?
- 3. Arrastrar y soltar: ¿es posible obtener la URL?
- 4. Arrastrar y soltar en Safari iOS: no arrastrar, no responder para soltar en el escritorio/iPad
- 5. Archivo Arrastrar y soltar en Firefox (v10)
- 6. Evitar que el navegador cargue un archivo de arrastrar y soltar
- 7. HTML5 arrastrar y soltar entre ventanas
- 8. ¿Es posible usar Linq-SQL sin arrastrar y soltar?
- 9. Mostrar superposición en 'dragenter' al arrastrar un archivo desde el escritorio al navegador
- 10. Implementar la función de arrastrar y soltar
- 11. Arrastrar y soltar usando SendMessage
- 12. Aplicación Swing -> Arrastrar y soltar en el escritorio/carpeta
- 13. Cambio del cursor del mouse para HTML5 Arrastrar y soltar archivos (GMail Arrastrar y soltar)
- 14. Arrastrar y soltar el archivo de texto
- 15. Excepción tragada al arrastrar y soltar
- 16. JQuery - Arrastrar y soltar archivos - ¿Cómo obtener información del archivo?
- 17. Arrastrar y soltar con columpio
- 18. arrastrar y soltar objetos personalizados
- 19. Cómo arrastrar y soltar un archivo '.txt' en obj-c
- 20. desactivar texto arrastrar y soltar
- 21. Swing arrastrar y soltar
- 22. ItemsControl Arrastrar y soltar
- 23. ¿Arrastrar y soltar polyfill?
- 24. Qt 4.x: ¿cómo implementar arrastrar y soltar en el escritorio o en una carpeta?
- 25. ¿Arrastrar y soltar es compatible con TreeItem?
- 26. ipad arrastrar y soltar
- 27. Arrastrar y soltar con una imagen
- 28. Arrastrar y soltar en Desktop/Explorer
- 29. arrastrar un JLabel con un TransferHandler (arrastrar y soltar)
- 30. Arrastrar y soltar en MobileSafari?
Si eso fuera posible, me imagino que tendrías que escribir una extensión de navegador. –
En realidad, es posible con Chrome: http://www.thecssninja.com/javascript/gmail-dragout – raymi