Glisser-déposer des liens dans une zone de saisie de formulaire à l'aide de jQuery

Question

J'ai une zone de saisie dans laquelle je souhaite glisser et déposer des liens dans jQuery. Mon objectif serait de cliquer sur le lien glisser/déposer dans la boîte de saisie et de le remplir avec le tag image si c'est un lien vers une image ou la balise href si c'est un lien vers un fichier.

Est-ce possible? Quelqu'un peut-il penser à des exemples pour quelque chose comme ça? Le plus de réponses le mieux, alors s'il vous plaît poster ce qui a fonctionné pour vous.

Merci d'avance!

Voici d'autres informations pour les personnes intéressées: La fonctionnalité glisser-déposer repose sur les navigateurs prenant en charge File.API.

Plus d'informations:

http://www.thebuzzmedia.com/html5-drag-and-drop-and-file-api-tutorial/

http://www.w3.org/TR/FileAPI/

Permettez-moi de savoir si cela a été utile et ou si je peux ajouter plus d'informations. Merci a tous!

Answer 1

Semble assez simple; au moins dans mon navigateur (Chrome) en faisant glisser un lien dans une entrée/zone de texte et en le remplissant avec l'URL que l'ancre référence est la fonctionnalité par défaut; par conséquent, ce qui suit devrait faire le travail.

$("input").change(function() { 
    if($(this).val().substring($(this).val().length-3, $(this).val().length) == 'jpg') { 
    $("a img").attr('src', $(this).val()) 
    } else { 
    $("a").attr('href', $(this).val()) 
    } 
}) 

Il est évident que vous voudriez développer le code pour soutenir d'autres types de fichiers et je suis sûr qu'il ya une meilleure façon de déterminer si l'URL fait référence à une image ou non, mais cela est un bon point de départ.

Si cela ne répond pas exactement à vos besoins, vous pouvez envisager l'événement à lier dans la zone de saisie en question; focus pourrait également être une option viable?