如何在javascript或jquery中将文件从一个应用程序拖放到另一个应用程序答案

【问题标题】：How to drag and drop a file from one application to another applicaion in javascript or jquery如何在javascript或jquery中将文件从一个应用程序拖放到另一个应用程序
【发布时间】：2016-12-16 12:08:47
【问题描述】：

我有一个 jquery web 应用程序，它包含一个缩略图列表。图片看起来像

<a href="#" draggable="true" id="anchorId" data-downloadurl="application/pdf:filename.pdf:http://www.pdf995.com/samples/pdf.pdf"><img draggable="false" alt="" src="imageSrcPath" title="Drag & Drop"></a>

当我尝试将此锚标记从我的应用程序拖到我的本地系统（桌面或任何其他目录）时，会立即复制 PDF 文件。它工作正常。

但现在我想将锚标记从我的应用程序拖到任何其他 LOB 应用程序（Gmail 撰写或快速书籍），没有任何反应。

下面的代码是dragstart，

document.getElementById("anchorId").addEventListener("dragstart",function(evt) {
    document.getElementById("anchorId").setAttribute("href", "http://www.pdf995.com/samples/pdf.pdf");
    evt.dataTransfer.effectAllowed = "copy";                             
},false);

我不知道将 event.dataTransfer 中的文件对象传输到 LOB 应用程序的 drop 事件。因为在 LOB 应用程序中，drop 事件期望文件为 event.dataTransfer.files。

所以请告诉我如何在 dragstart 事件中传输文件？

谢谢

【问题讨论】：

标签： javascript jquery events drag-and-drop quickbooks

【解决方案1】：

你可以试试：-

$(document).on('dragover', function(e) {
     e.preventDefault();
});
$(document).on('drop', function(e) {
    e.preventDefault();
    e.originalEvent.dataTransfer.items[0].getAsString(function(url){
        alert(url);
    });
});

当我从另一个浏览器窗口拖动该图像时，得到“http://static3.flattr.net/thing/image/9/4/5/5/0/huge.png?1326712342”。

.getAsString 接受一个回调，一旦它被调用，它就会获取 url 作为参数

无法在火狐上运行

【讨论】：