Drag and Drop links into a form input box using jQuery

I have an input box that I would like to drag and drop links into using jQuery. My goal would be to click the link drag/drop it into the input box and have it populate the image tag if its a link to an image or the href tag if its a link to a file.

Is this possible? Can anyone think of any examples for something like this? The more answers the 开发者_开发问答better so please post what worked for you.

Thanks in advance!

Here is some more information for people who are interested: The drag and drop feature relies on browsers supporting File.API.

More information:

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

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

Let me know if this was helpful and or if I can add more information. Thanks all!

Seems simple enough; at least in my browser (Chrome) dragging a link into a input/textarea and having it populate with the URL that the anchor references is default functionality; therefore the following should do the job.

$("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())
  }
})

Obviously you'd want to expand the code to support further filetypes and I'm sure there are better way to identify whether the URL refers to an image or not, but this is a good starting point.

If this doesn't serve your exact needs you might want to consider what event to bind on the input box in question; focus could also be a viable option?