Faites glisser et déposez des images d'un autre site web à la mienne
J'ai lancé une recherche rapide sur google et j'ai trouvé des questions similaires, mais aucune n'était bien formée et la plupart étaient vieilles et avaient l'air abandonnées (pas de réponses et pas de commentaires pendant un moment). Donc, ici, va...
Je veux pouvoir collecter l'url (SEULEMENT l'url) d'une image déposée sur mon site à partir d'un autre site web.. (c'est à dire que j'ai deux chrome fenêtres ouvertes. Fenêtre a ma demande, il. La fenêtre B A imgur dedans. J'ouvre un clic d'image et le fais glisser vers ma fenêtre et laisse aller. Maintenant j'ai besoin de savoir l'url de l'image a chuté sur ma page).
Voici le code avec lequel je travaillais pour les fichiers locaux.
$(document).on('drop', function(e) {
var data = e.dataTransfer || e.originalEvent.dataTransfer;
console.log(data); // data.files is empty
e.preventDefault();
return false;
});
Encore une fois, je ne veux rien télécharger.. je n'essaie pas de faire quelque chose de compliqué... J'ai juste besoin de connaître l'emplacement de l'image d'être tombé sur la page d'un autre site.
3 réponses
, Essayez ceci: 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);
});
});
Je reçois "http://static3.flattr.net/thing/image/9/4/5/5/0/huge.png?1326712342" Quand j'ai fait glisser cette image d'une autre fenêtre du navigateur.
.getAsString prend un rappel qui obtient l'url en argument une fois qu'il est appelé
Ne fonctionne pas sur firefox
Vous pouvez utiliser ceci
$(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;
})
Basé sur la réponse de Yunus, cela semble fonctionner dans FF:
e.originalEvent.dataTransfer.getData('text/html').match(/src\s*=\s*"(.+?)"/)[1]