拖放图片来自其他网站矿(Drag and Drop images from another webs

2019-06-25 19:36发布

我跑了快速谷歌和SO搜索,发现类似的问题,但没有被很好地形成,最是老神情抛弃(没有答案,并且一段时间内没有评论)。 所以这里去...

我希望能够收集图像的URL(仅限网址)被丢弃到我的网站从其他网站。(即我有两个镀铬窗户打开。窗口A中有我在它的应用程序。窗口B具有imgur在它我打开一个图像点击并将其拖动到我的窗户,让走了。现在,我需要知道图像的URL翻掉页)。

这里是我正在同本地文件的代码。

$(document).on('drop', function(e) {
    var data = e.dataTransfer || e.originalEvent.dataTransfer;
    console.log(data); // data.files is empty
    e.preventDefault();
    return false;
});​

再次,我不想随意上传..我不想做任何特别的事......我只需要知道图像的位置被丢弃在页面上从其他网站。

Answer 1:

试试这个: http://jsfiddle.net/2Jet2/70/

$(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作为参数,一旦它被称为

在Firefox不工作



Answer 2:

您可以使用此

$(document).bind('drop', function (e) {        
    var url = $(e.originalEvent.dataTransfer.getData('text/html')).filter('img').attr('src');
    if (url) {
        jQuery('<img/>', {
            src: url,
            alt: "resim"
        }).appendTo('#yourId');            
    }
    return false;
})


Answer 3:

根据尤纳斯的答案,这似乎在FF工作:

e.originalEvent.dataTransfer.getData('text/html').match(/src\s*=\s*"(.+?)"/)[1]


文章来源: Drag and Drop images from another website to mine