Image Thumbnail through URL [closed]

1

I want to do this:

There is a field where the user inserts the URL of an image, and wanted to paste this url into the field, a thumbnail appears next to (or below) the field, similar to what FB does, where you paste the URL url of the video in the post, and it displays the thumbnail.

    
asked by anonymous 26.01.2017 / 22:43

1 answer

2

Use the "paste" event of Jquery to detect the url paste in the field and then retrieve the value and create the img element with the image.

$(document).ready(function(){   
  
    //ao colar a url no campo
    $("#url").bind('paste', function() {
        setTimeout(function(){
          
          var url = $("#url").val();
          var img = '<img src="'+url+'">';
          $(".img").append(img);
        
        }, 100);
    });

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>URL:<inputtype="text" name="url" id="url">

<p align="center">
  <div class="img"></div>
</p>
    
27.01.2017 / 00:06